如何在Angular 2中设置ngFor中的绑定？

Question

注意：我发现了几个类似的问题，但没有一个真正回答我的（通用）问题

我有这个

component.ts

first: string;
second: string;
third: string;
fields = ["first", "second", "third"];

我希望能够在 component.html 中生成一个复杂的组件（，而不导入自定义指令），其中包括：

• 必需：基于字段[i]

  的ngModel绑定

  （例如，i = 0，fields [i] =＆＃34; first＆＃34;，ngModel = first ）

• Desiderable ：使用fields [i]作为字符串分配给任何DOM元素属性（例如

循环如下：

 <div *ngFor="let field of fields">
      <label for="???>
      [(ngModel)]="???"
 </div>

关于第二点，它适用于id和div的内容。

...然而

• 在ngModel的情况下：[（ngModel）] =＆＃34; field＆＃34;导致异常（无法分配给引用或变量！）

• 在将字符串分配给（例如）

  的情况下

   <label for="{{field}}">,
  

  我也有例外（无法绑定到＆＃39;因为它不是已知的原生属性（＆＃34;我＆＃34;＆gt; < /强>）

Answer 1

＆gt; = RC.6

 <label for="{{field}}">
 <label [for]="field">

<强>＆LT = RC.5

 <label attr.for="{{field}}">
 <label [attr.for]="field">
 <label [htmlFor]="field">

<强>更新

<div *ngFor="let field of fields; let i=index; trackBy:trackByIndex">
  <label htmlFor="field">
  <input [(ngModel)]="fields[i]">
</div>

并将其添加到组件

trackByIndex(index: number, obj: any): any {
  return index;
}