After upload a image in angular 2, shows 404 not found - javascript

I know this is very a general question but I am failing to show a file in Angular 2 after upload. Although a file is existed on folder. It showing when I restarted angular.
Source tree my project
upload folder is saving image uploaded

Have you try to empty your cache before building again ?
Images are pretty often kept in the cache, so you should have a look there.
Also you might want to create a folder that you can access easily from any component for things like images. For example if you use Angular-Cli, check the assets part.
https://github.com/angular/angular-cli/wiki/stories-asset-configuration

Well, it should be something like :
<img alt="Alternative" [src]="'./upload/yourImage.something'">
If you are trying to use the image in app.component.ts or app.component.html.
But it's pretty hard to find what's wrong since you don't show your code.

Related

Make a small HTML application update a JSON file

I want to make a local HTML application read and update a JSON file and use its content to display HTML content. Alas, I'm stuck at the very first step, as I can't seem to setup any sort of test file that simply notices and reads a JSON file. From what I see online, I need to use other libraries. I attempted to use require.js but I can't make it work and the documentation doesn't help me.
I imported the require.js with a tag and attempt to launch something out of what I got from the documentation, but there's nothing to do. It doesn't look like it's willing to take .json files.
requirejs([
'example'
], function(example) {
const config = require('./config.json')
});
My issue is to get the program to read the file. From there I believe I can make the display of it, but this JS thing is all alien to me.
The recommended way would be to run a web server or use something like Electron and build a desktop app (as #chrisG points out in the comments). But if you wanna do this in the browser without an web server you could do something like:
Run Chrome with the --allow-file-access-from-files (or however you allow local file access in your browser of choice)
Put your JSON in a js file and load it (to just do this you don't need the flag, but if you want to use absolute path you'll need it)

Wordpress "The Events Calendar" editing the month view

I am working to edit the month view of "The Events Calendar" in Wordpress. I cannot seem to figure out which files contain the relevant markup. The file structure seems to make sense, however, when I edit anything with /month no changes reflect.
The File Structure
Core Plugin Files
.../plugins/the-events-calendar/src/views/
Here we have several folders with the different views. One of which is "month" and, according to the documentation, contains the files I wish to edit.
Theme Files
.../mytheme/tribe-events/
This is the folder the documentation told me to create to place edited templates in.
The Fubar
When i follow the documentation for editing a single event located in /list everything works as expected. All I need to do is create a subfolder in mytheme/tribe-events/list and put a new file within to override the original.
When I repeat these same steps in order to edit a file within /month view things are different. For some reason none of my changes work. Outside of the /month folder in /views there is a month.php file which contains the following...
do_action( 'tribe_events_before_template' );
// Title Bar
tribe_get_template_part( 'month/title-bar' );
// Tribe Bar
tribe_get_template_part( 'modules/bar' );
// - My Custom Code -
write_log('This Log Works');
// Main Events Content
tribe_get_template_part( 'month/content' );
do_action( 'tribe_events_after_template' );
Note: write_log() is a function I use in php for debugging. It's essentially a console.log but appends the data to the end of the error.log file which i have being read by a terminal. I do not believe the issue is with this function as I have tested other methods.
The "month" file echoes my log just fine. However, when I add the same log into any of the files it is pulling from the 'month/' directory I get nothing. I went through every file in the subdirectories and added a log and realized that they all work except any file within /month
I thought maybe the issue was with the plugins' "tribe_get_template_part()" function pointing to the wrong place so I decided to eliminate the "am i making this child plugin right" variables and just start editing the plugin files directly. But I get the exact same behavior. I got so desperate that I deleted the entire /months folder from the plugin and the calendar still worked!
So obviously I am really missing something but currently I am at a loss.
This documentation is what I've been following to figure this out.
https://support.theeventscalendar.com/153124-Themers-Guide
The only thing I can think of at this point is that the javascript templating system built into the plugin is working some hidden magic but the fact that I can delete the entire months folder leaves me at a loss.
For anyone struggling with this still, I also had the same issue and solved it by disabling the Month View Cache under Event Settings > Display. Screenshot:

Paths in Dynamic Page Replacing Content

For dynamic page changes without having to reload the whole content, I have found this very simple working solution:
Tutorial: http://css-tricks.com/rethinking-dynamic-page-replacing-content/
Demo: sudojesse.github.io/dynamic-page/
However, this solution only works if you're linking to something like "sitename.html". Is it possible to do the same with folder paths?
Example:
Like it is above:
[sudojesse.github.io/dynamic-page/about.html][1]
Like I want it:
[sudojesse.github.io/dynamic-page/more/about/][2]
I have tried it but it doesn't really work!
http://sudojesse.github.io/dynamic-page/about.html
http://sudojesse.github.io/dynamic-page/more/about/
If you want it to work, you would have to rename the file to "index".
The reason for this is because the Web server looks after a specific resource when the client requests a directory. This resource is often by default set to "index"(dot)"something".

Reference to ejs view files does not change after the build, although it combines it inside of production.js - Javascript MVC

In the code we use something like this:
$('#wrapper').html('//app/views/content.ejs', {foo:"bar"});
And when we build the app, this still stays the same, although the content.ejs file is built into production.js.
So my question is, what should we do so that when we build the app, these references point to ejs files inside of production.js?
We are using JMVC 3.2.2
We've also tried using this way:
$('#wrapper').html( $.View('//app/views/content.ejs', {foo:"bar"}) );
Your views are not getting added to production.js; you need to steal each one of them:
steal('//app/views/content.ejs');
JMVC 3.1:
steal.views('//app/views/content.ejs');
Got the answer in JMVC forum: https://forum.javascriptmvc.com/topic/#Topic/32525000000958049
Credit to: Curtis Cummings
Answer:
The paths to the views do not need to change.
When the production.js file is created, your views are included and
get preloaded when the script runs. When you reference:
'//app/views/content.ejs', view first checks if the view file you are
requesting has been preloaded and if it has, will use that instead of
making a request for the .ejs file.

Problem in displaying all images inside the folder using javascript

Hi,
For my project I m using jquery bulit in photo slide show,jquery code is taking images from array and displaying the images..The problem is I have a lot of images which I don't want to put it in Array(because it need manual effort) instead of that I want to read each image from the folder and display the images. the advantage of doing so is whenever you want to add more images you need to drop it in folder since you are reading images from folder so need not to do any thing in code level.so it makes your work easier and simpler.. so is there any way to achieve the same using javascript?.
Thanks in Adavance.
Javascript being client-side, it's possible to list the content of a server directory with it. You'll need some server side scripting to do that, like PHP.
see this SO question for an example
I think you should add an Ajax request to get the names of file in the directory.
After you can just pass along the array and show only those images in the slideshow.

Categories