Question

我在Angular v6中遇到角度反应形式的奇怪问题我在角度v1.2，v1.6和v1.7中使用了表单数组。我最近将CLI升级到最新版本的Angular CLI v6.0.5。

相同的源代码在以前的版本中运行得很好，但在最新的CLI中却没有。

我收到的错误如下：

找不到不同的支持对象＆＃39; [object Object]＆＃39;类型＆＃39;对象＆＃39 ;. NgFor仅支持绑定到Iterables，例如Arrays。

对象本身如下所示：

createForm(): void {
    this.mainForm = this.formBuilder.group({
        itemRows: this.formBuilder.array([
             this.initForm()
         ])
    });
}

initForm(): FormGroup {
    return this.formBuilder.group({
        item1: ['', [Validators.required]]
        // other form controls created here.
    })
}

Angular抱怨无法迭代 this.mainForm.controls.itemRows 。但请注意， this.mainForm.controls.itemRows 是表单数组。

错误显示在视图中的这一行：

<form [formGroup]="mainForm">
    <div formArrayName="itemRows"> <!-- Problem here in v6 -->
        <div *ngFor="let itemRow of mainForm.controls.itemRows">
            <!-- rest of the form -->
        </div>
    </div>
</form>

我找到了建议（link1）（link2）（link3），建议我从对象创建一个数组，但它看起来并不干净，特别是在处理复杂时像反应形式的对象。有没有人用最新的CLI遇到过这个问题？

另外，为什么改变以前完美的工作？只是说。

Answer 1

itemRows是一个对象。

它可以像这样迭代

<div *ngFor="let itemRow of mainForm.controls.itemRows.controls">

在ngFor中迭代反应式表单数组对象

1 个答案: