为什么 FormArray 不能分配给 NgIterable<any>？

Question

我试图将 FormArray 传递到组件中。此组件模板迭代 FormArray 并显示数据。它允许用户添加到数组或删除项目。

子组件 ts

@Input()
public formArray!:FormArray;

然后在模板中我尝试：

<div class="formRow child2" *ngFor="let year of formArray; let i=index">
  List Number #{{i+1}} &nbsp; &nbsp;
  <mat-form-field class="col3 no-bottom" appearance="fill">
    <mat-label>{{ "YEAR" | translate }}</mat-label>
    <input matInput placeholder="Year" mask="0000" [formControl]="year">
  </mat-form-field>
    <button mat-flat-button color="accent" (click)="addYear()">
      <span class="material-icons">Add Year</button>

但是，我收到一条错误消息：

Type 'FormArray' is not assignable to type 'NgIterable<any> | null | undefined'.
<div class="formRow child2" *ngFor="let year of formArray; let i=index">

谁能解释为什么会这样？非常感谢。

Answer 1

应该是

*ngFor="let year of formArray.controls;

formArray.controls 是可迭代的

查看工作演示 here

为什么 FormArray 不能分配给 NgIterable<any>？

Why is FormArray not assignable to NgIterable<any>?

angular

angular-material

angular-reactive-forms