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_compo         


        

Answer 1

Angular-cli includes the assets folder in the build options by default. I got this issue when the name of my images had spaces or dashes. For example :

• 'my-image-name.png' should be 'myImageName.png'
• 'my image name.png' should be 'myImageName.png'

If you put the image in the assets/img folder, then this line of code should work in your templates :

<img [alt]="My image name" src="./assets/img/myImageName.png'">

If the issue persist just check if your Angular-cli config file and be sure that your assets folder is added in the build options.

Answer 2

Copy your images into the assets folder. Angular can only access static files like images and config files from assets folder.

Try like this: <img src="assets/img/myimage.png">

Answer 3

Create image folder under the assets folder

<img src="assets/images/logo_poster.png">

Answer 4

Try This:

<img class="img-responsive" src="assets/img/google-body-ads.png">