I am very new to angular 2 I am stuck here where i have to display an image for which I'm using relative path­­­­­­­­­­­­­­­­­­­­

<img src="./../images/publicVideo1.PNG">

but getting the below error

null:1 GET http://localhost:4200/null 404 (Not Found)

The above is the app structure where I have image in images folder which I'm trying to access from public-videosponent.html

I dont understand where I'm wrong Any help would be appreciated.

I am very new to angular 2 I am stuck here where i have to display an image for which I'm using relative path­­­­­­­­­­­­­­­­­­­­

<img src="./../images/publicVideo1.PNG">

but getting the below error

null:1 GET http://localhost:4200/null 404 (Not Found)

The above is the app structure where I have image in images folder which I'm trying to access from public-videos.ponent.html

I dont understand where I'm wrong Any help would be appreciated.

• javascript
• angular
• angular2-template

• i think you should try <img src="./images/publicVideo1.PNG"> if this img is written inside app.ponant.html – abdoutelb Commented Jun 10, 2017 at 10:52

4 Answers 4

create one dir assets in src directory. and move images directory into assets and then you can access image like that. image not found in app folder because we need to set path in assets[] block in the .angular-cli.json. we need set path into asset block we access it. does this help.

<img src="../../assets/images/publicVideo1.PNG">

angular-cli.json

Try like this one here

<img [src]="defaultProfilePic" />

and in your ponent

defaultProfilePic: string ='assets/profile.png';

if this doesn't work it is because of the relative path you used. If you are using visualCode it will help you finding the exact path.

Mention the path relative to your index.html. If your index.html is inside the src folder, then try this:

<img src="./app/images/publicVideo1.PNG">

try this <img src="./src/app/images/publicVideo1.PNG">