javascript - Angular 8 *ngFor 中 HTML 输入中的数据绑定(bind)

Question

我正在使用 *ngFor 循环对象数组并在 HTML 中显示值。在 HTML 中，该值显示在输入元素中，因为我希望用户根据需要更改该值，然后使用“保存”按钮保存更改后的值。不幸的是，数据绑定(bind)根本不起作用。数组中的值未显示。这是我的代码:

<tr *ngFor="let data of rrReasons; let i = index;trackBy:trackByIndex;">
<td>
  <input type="number" name=a{{index}} [(ngModel)]="rrReasons[index].signatory1">
</td>

这是 json:

{ “签名者1”:“1009648”， “签名2”:“1003444”， }

Answer 1

您正在使用rrReasons[index].signatory1。 index 不可用作循环内的变量。

您应该使用 rrReasons[i].signatory1 或 data.signatory1。

<table>
  <tr *ngFor="let data of rrReasons; let i = index;trackBy:trackByIndex;">
    <td>
      <input type="number" name=a{{i}} [(ngModel)]="rrReasons[i].signatory1">
    </td>
</table>

演示:https://stackblitz.com/edit/angular-zmscxv