how to bind img src in angular 2 in ngFor?

by

Angular 2, 4 and Angular 5 compatible!

You have provided so few details, so I’ll try to answer your question without them.

You can use Interpolation:

<img src={{imagePath}} />

Or you can use a template expression:

<img [src]="imagePath" />

In a ngFor loop it might look like this:

<div *ngFor="let student of students">
   <img src={{student.ImagePath}} />
</div>

More Related Contents:

  1. *ngIf and *ngFor on same element causing error
  2. ngFor with index as value in attribute
  3. How to use `trackBy` with `ngFor`
  4. function gets called several times
  5. How to iterate object keys using *ngFor?
  6. how to use track by inside ngFor angular 2
  7. Error trying to diff ‘[object Object]’ in Angular
  8. How to create variable in ngFor loop?
  9. Property ‘map’ does not exist on type ‘Observable’
  10. Inject a service manually
  11. How to disable a input in angular2
  12. Can’t bind to ‘ngIf’ since it isn’t a known property of ‘div’ [duplicate]
  13. Can an ng-content be used inside of an ngFor?
  14. document.getElementById replacement in angular4 / typescript?
  15. How can I avoid adding prefix “unsafe” to a link by Angular 2? [duplicate]
  16. angular 2 change detection and ChangeDetectionStrategy.OnPush
  17. Uncaught Error: Unexpected directive ‘MyComboBox’ imported by the module ‘AppModule’. Please add a @NgModule annotation
  18. Angular 2 passing object via route params possible?
  19. access SASS values ($colors from variables.scss) in Typescript (Angular2 ionic2)
  20. Angular2 routing / deep linking not working with Apache 404
  21. Include assets when building angular library
  22. is there any alternative for ng-disabled in angular2?
  23. How to uninstall/upgrade Angular CLI?
  24. Angular 2 : No NgModule metadata found
  25. How to make nested Observable calls in Angular2
  26. How to validate white spaces/empty spaces? [Angular 2]
  27. Style html,body from web component (Angular 2)
  28. Angular2 Routing – keeping state of component when route changes [duplicate]
  29. How to send 1000 XHTTP Requests with maximum number of parallel requests
  30. Angular Material2 theming – how to set app background?

Leave a Comment