How to set unique template reference variables inside an *ngFor? (Angular)

by

Your template reference variable is already unique because you use it inside embedded view scope:

<div *ngFor="let person of attendeesList">
  <input #attendee [ngModel]="person.name" (blur)="person.name = attendee.value"/>
</div>

Working Example

But you can even omit template reference variable as shown below:

<div *ngFor="let person of attendeesList">
  <input [ngModel]="person.name" (blur)="person.name = $event.target.value"/>
</div>

More Related Contents:

  1. How do I pass data to Angular routed components?
  2. Angular File Upload
  3. How can I get new selection in “select” in Angular 2?
  4. Ionic 2 – global NavBar for the app
  5. Angular: How to correctly implement APP_INITIALIZER
  6. Angular 2 – 2 Way Binding with NgModel in NgFor
  7. No provider for HttpClient
  8. Argument of type ‘string | null’ is not assignable to parameter of type ‘string’. Type ‘null’ is not assignable to type ‘string’
  9. How do I detect user navigating back in Angular2?
  10. Access environment variables in production build Angular 4
  11. How to call component method from service? (angular2)
  12. Angular2 – Setting date field on reactive form
  13. Cannot read property of ‘xxx’ of undefined
  14. Angular 6 does not add X-XSRF-TOKEN header to http request
  15. Lazy Loading BrowserModule has already been loaded
  16. Angular 2 input parameters on root directive [duplicate]
  17. Angular 2: How to use JavaScript Date Object with NgModel two way binding
  18. Unit testing click event in Angular
  19. want to show more data in another component when view in detail button is clicked (angular 6)
  20. Tracking scroll position and notifying other components about it
  21. Avoiding relative paths in Angular CLI
  22. ERROR in TypeError: Cannot read property ‘flags’ of undefined
  23. Angular 4: How to read data from Excel?
  24. Sanitize input in Angular2 [duplicate]
  25. Property ‘toPromise’ does not exist on type ‘Observable’
  26. TypeError: Object prototype may only be an Object or null: undefined Angular 8
  27. Angular 4 ExpressionChangedAfterItHasBeenCheckedError
  28. Page transition animations with Angular 2.0 router and component interface promises
  29. Angular load external configuration before AppModule loads
  30. Angular 2 ngOnInit not called

Leave a Comment