javascript - 双向绑定(bind) : array of numbers within angular application

Question

我需要用一组输入数字以两种方式绑定(bind)数字数组:

Ligne.Component.ts

export class LigneComponent implements OnInit {

  @Input() cells: Array<number>;

  constructor(private lgservice: LigneserviceService ) {
    this.lgservice.init(4032,10);
    this.cells = this.lgservice.cells;
    }

  ngOnInit() {
  }
  onSearchChange() {

      for (let cell of this.cells) {
      {
        console.log(cell);
      }
  }
}

Ligne.Component.html

<div *ngFor="let cell of cells">
  <input value="{{cell}}" type="number" [min]="0" [max] ="9" maxlength="1" class="row" (input)="onSearchChange()" >
</div>

似乎绑定(bind)以单一方式工作，即:我得到默认值(等于 0)。但是当我更改单元格的值时，我总是得到 0 作为所有单元格的值!!

所以我需要知道如何解决这个问题？

谢谢，

Answer 1

您使用的值绑定(bind)不正确。你应该在这里使用 ngModel。此外，您的单元格应该是一个对象，其中包含一些字段，其中包含一个数字。然后稍微更改您的模板:

<div *ngFor="let cell of cells">
  <input [(ngModel)]="cell.field" type="number" [min]="0" [max] ="9" maxlength="1" class="row" (input)="onSearchChange()" >
</div>