Angular 4 img src is not found

Question

I'm having a problem with sourcing an image with angular 4. It keeps telling me that the image is not found.

Folder structure:

app_folder/
app_component/
  - my_componenet
  - image_folder/
      - myimage

I am using the image in mycomponent. If in mycomponent, I insert it directly with:

<img src="img/myimage.png"

This works fine, but I checked the html and it creates a hash. But my images have to be dynamically added to the html because they are part of a list. So, if I use:

<img src="{{imagePath}}">

which is basically img/myimage.png, it doesn't work. If I use:

<img [src]="imagePath">

It says NOT FOUND (htttps://localhost/img/myimage.png). Can you help me?

Answer 1

AngularJS

<img ng-src="{{imagePath}}">

Angular

<img [src]="imagePath">