Menu
Everything I have put on my site functions correctly, but every image that I try to put into the site (with the exception of the background) gives back a 404 Not Found Error.
All of my images are located at "Project/src/assets/images" and I have tried the following img tags in my html documents. The documents are located in "Project/src/app/tabs".
<img src="src/assets/images/image_name.jpg">
<img src="/src/assets/images/image_name.jpg">
<img src="./src/assets/images/image_name.jpg">
I set the background image for my page using css and it works. This is the selector and the attribute I have applied:
background: url('assets/images/greybackground.jpg') no-repeat center center fixed;
How can I add images to my HTML documents without getting the 404 error?
857
You're using the wrong path to the images. In the Angular project, you don't have to add the relative path from your file to image file. Angular resolves this problem for you, and in a component, you have to only add a path to the assets folder, instead of ../../assets.
Upload the simple image you need to create an application using the command " ng new my-app". You have to open your HTML component and then use the image tag and put the image with a name or with their proper path, such as: <img src=” ../../assets/images/image. jpg” class=” img1”> .
To show the image preview in Angular, we declared the img HTML tag and bind the src tag to the variable. We will assign the image URL to the src variable using the new FileReader() method.
Your html files are in "Project/src/app/tabs" and you are trying to access from that folder thats why images are not loading.
So you need to come back from tabs folder and app folder to reach the base directory for both your code and images.
Use ../ to come back from a folder. So after reaching base directory just use normal directory listings.
So answer is
<img src="../../assets/images/image_name.jpg">
<img src="../../assets/images/image_name.jpg">
<img src="../../assets/images/image_name.jpg">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
