Question

更新
下面的代码很好。还有另一个函数调用重置mainForm的控件导致错误。

我正在尝试将html模板绑定到被动形式。但我收到以下错误：

ERROR Error: Cannot find control with path: 'forms -> 0'

以下是我正在使用的文件和模板。

component.ts

mainForm = new FormGroup({
  forms: new FormArray([]),
});

...

buildForm() {
  for ( let i = 0; i < this.items.length; i++ ) {
    const fg = new FormGroup({
      active: new FormArray([]),
      price: new FormArray([]),
      moq: new FormArray([]),
    });
    this.items[i].orderBy.forEach(o => {
      (<FormArray>fg.get('active')).push(new FormControl(false));
      (<FormArray>fg.get('price')).push(new FormControl({ value: '', disabled: true }, [Validators.required]));
      (<FormArray>fg.get('moq')).push(new FormControl({ value: '', disabled: true }, [Validators.required]));
    });

    (<FormArray>this.mainForm.get('forms')).push(fg);
  }
}

HTML

<div [formGroup]="mainForm">
  <div formArrayName="forms">
    <div formGroupName=0>
    </div>
  </div>
</div>

formGroupName=0只是一个临时测试。它应该看起来像<div [formGroupName]="row.$$index">，可能由ngx-datatable使用。

但是我不明白为什么它说控制没找到，当它在那里我控制台登录表格时。表单也是在生成行之前构建的。

Answer 1

以这种方式尝试：

<div [formGroup]="mainForm">
  <div formArrayName="forms">
    <div *ngFor="let form of mainForm.controls['forms'].controls; let i = index", [formGroupName]="i">
    </div>
  </div>
</div>

希望这会对你有帮助！

具有阵列的角4反应形式

1 个答案: