CODEWITHSUNDEEP
angular
PRUDHVI RAJ
PRUDHVI RAJ

Reputation: 41

Input filed is not working properly in place of ngFor

Values entered by the user inside a given input field shows only one letter. Can anyone please help.

https://stackblitz.com/edit/angular-8kpyxt?file=src%2Fapp%2Fapp.component.html

Upvotes: 0

Views: 837

Answers (1)

Chellappan வ
Chellappan வ

Reputation: 27353

Use trackBy

The trackBy function takes the index and the current item as arguments and needs to return the unique identifier for this item

component.html

<div class="form-group" *ngFor="let Type of type.headings;trackBy: cmpare;let i=index">
<label>Heading{{i+1}}</label>
<input type="text" class="form-control" [name]="'name1_'+i" [(ngModel)]="type.headings[i]">
</div>

component.ts

cmpare(index) {
  return index;
}

Example:https://stackblitz.com/edit/angular-uwfphr Ref:https://angular.io/api/common/NgForOf#change-propagation

Upvotes: 5

Related Questions