How to bind an Image from App Component to HTML file in Angular 2

Question

How to bind an Image from App Component to HTML file in Angular 2 This is my Relative path : assets/images/MyProfile_Summary_1x.png

 export class MyProfile { image :"./assets/images/MyProfile_Summary_1x.png"; } 

 body { margin: 0; } #over img { margin-left: auto; margin-right: auto; display: block; } 

  <div id="over" style="position:absolute; width:100%; height:100%"> <img [src]="image"> </div> 

Answer 1

actually, you are using colon operator which is used for defining the type of any variable in ts

so you just need to replace this

image :"./assets/images/MyProfile_Summary_1x.png";

with

image = "./assets/images/MyProfile_Summary_1x.png";

if you still face the same issue then please verify your file path as well.