ngFor在推送新数据时不更新

Question

我有一组反应式表单，我将它们设置为反应式表单数组：

typesForms: FormGroup[] = [];

我在我的 html 中循环：

<form *ngFor="let type of typesForms; let i = index" [formGroup]="typesForms[i]" class="row">

但是，当我推送新表单时，HTML 不会更新。

this.typesForms.push(this.formBuilder.group({
    type: { value: data['type'], disabled: true }
}));

我已经注销了结果数据，它显示了新的表单对象，但前端没有。我认为这与反应形式有关，但我不确定我是否在搞砸其他事情。

Answer 1

你试过<form *ngFor="let type of typesForm" [formGroup]="type" class="row">吗？

---

更新：

如果您有多个表单，您可以使用 Angular 内置的 FormArray 数据结构。它确实简化了对一组表单组的操作 - 允许您轻松跟踪更改并验证链接的 FormGroup 或 FormControl 。

Punkr example

注意：感谢ReactiveFormsModule 下的事物结构，您可以根据需要编写FormArrays、FormGroups 和FormControls：

• 您可以将FormArray 作为FormGroup 的字段a
• FormArray 可以包含FormArrays、FormGroups 和FormControls