小编use*_*751的帖子

我有一个角度组件对应一个表单/页面生成一个不确定数量的子组件,每个组件代表一个单独的字段,我希望父组件的FormGroup验证子组件中包含的字段.只有当我这样做时,我才会收到错误:

FormControlName必须具有相应的FormGroup.

这是我父组件的模板代码:

<div class="form-group" [formGroup]="parentGroup">
  <table>
    <tbody>
      <tr *ngFor="let i of array">
        <child [property]="i" [options]="myForm.controls[i.id]"></child>
      </tr>
    </tbody>
  </table>
</div>

表单在此处的组件文件中定义.我根据我们添加的子组件数量添加FormControls:

private formAttrs: FormGroup;

constructor(private _fb: FormBuilder) { }

ngOnInit() {
  this.myForm = this._fb.group({});
  for (var i = 0; i < this.array.length; i++) {
    this.formAttrs.addControl(this.array[i].id, new FormControl(this.array[i].value, Validators.required));
  }
}

子组件的模板代码如下:

<td class="prompt">
  {{i.label}}
</td>
<td class="required" width="1%">
  <span *ngIf="property.required">*</span>
</td>
<td>
  <input type="text " class="form-control" [ngClass]="{error: !options.valid}" formControlName="property.id">
</td>
<td>

虽然子组件类中没有定义任何内容(除了"属性"和为"选项"传递下来的FormControl元素),我认为父组件中的formGroup将能够与子组件中的formControlName匹配组件,但我得到错误:

EXCEPTION: Error in ./ChildComponent class ChildComponent - inline …