CODEWITHSUNDEEP
htmlangulardirectory-structure
Hadasa Sh
Hadasa Sh

Reputation: 11

problems with img tag in angular

I'm trying to loud a jpg logo in angular app, using <img> tag in the HTML of header component. If i click on my path in VS CODE it gets to my image but on the browser I get error 404.

this is my code:

<div class="logo">
  <img src="/src/assets/2.png" alt="Logo" style="height: 100px; width: 100px">
</div>

I tried playing around with the path, tried to use a relative path but got again 404 un the browser. I've tried loading through the css, but that hasn't worked,

This is my project structure.

Upvotes: 1

Views: 48

Answers (1)

Flo
Flo

Reputation: 3137

In Angular when you set an image src which is inside the assets folder, you must set it like this:

<div class="logo">
  <img src="assets/2.png" alt="Logo" style="height: 100px; width: 100px">
</div>

The first path part is always without the slash! Then it should be work as well!

Upvotes: 1

Related Questions