输入字段无法正常工作以代替 ngFor

【问题标题】：Input filed is not working properly in place of ngFor输入字段无法正常工作以代替 ngFor
【发布时间】：2019-06-28 00:17:40
【问题描述】：

用户在给定输入字段中输入的值仅显示一个字母。谁能帮忙。

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

【问题讨论】：

如果你在这种情况下使用响应式表单，问题就会得到解决。

标签： angular

【解决方案1】：

使用trackBy

trackBy 函数将索引和当前项作为参数并且需要返回这个项目的唯一标识符

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;
}

示例：https://stackblitz.com/edit/angular-uwfphr 参考：https://angular.io/api/common/NgForOf#change-propagation

【讨论】：