CODEWITHSUNDEEP
angulartypescriptangular2-templateangular2-formsangular2-directives
Keval Patel
Keval Patel

Reputation: 995

Render static image in image tag in Angular 2

I want to attach image to the image tag in angular 2.

I have following structure for my application,

Structure

In choice.Component.html view I want to show UserDefaultImage.png image in image tag.

I tried below things, but no luck.

<img src="../images/DefaultUserImage.png" />
<img src="./images/DefaultUserImage.png" />
<img src="/images/DefaultUserImage.png" />
<img src="app/images/DefaultUserImage.png" />
<img src="/app/images/DefaultUserImage.png" />

What path I need to add, to make it work?

Upvotes: 0

Views: 1352

Answers (2)

Aman Jain
Aman Jain

Reputation: 2592

When you move to the browser and inspect the element you will find the path of the image like this

http://localhost:3000/images/DefaultUserImage.png

You should move your images folder to assets folder and use this 

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

Upvotes: 2

dennee
dennee

Reputation: 49

From: https://angular.io/guide/quickstart

assets/* A folder where you can put images and anything else to be copied wholesale when you build your application.

It's work: <img src="assets/images/test.png" />

Upvotes: 2

Related Questions