嵌套的反应形式

时间:2019-05-02 09:07:51

标签: angular angular-reactive-forms

我有一个带有嵌套反应形式的角度应用程序。请验证我通过在子代中传递父表单引用来嵌套表单的方法是否合适。另外,如果可能的话,建议我采用更好的方法。 以下是我的代码的参考。 https://stackblitz.com/edit/angular-usmwua

/*parent component*/
profileForm:FormGroup = this.fb.group({
    firstName:['', Validators.required],
    lastName:[''],
    address:AddressComponent.generateAddressComponent()
})

/*child component*/
static generateAddressComponent(){
   return new FormGroup({
      city:new FormControl('',[Validators.required])
   })
}

1 个答案:

答案 0 :(得分:0)

我认为最好将父母表格传递给孩子:

<child-component [form]="profileForm">

并从子组件添加到表单组:

  _form: FormGroup;
  @Input()
  get form(): FormGroup {
    return this._form;
  }

  set form(val: FormGroup) {
    this._form = val;
    this._form.addControl('address', new FormGroup({
      city:new FormControl('',[Validators.required])
   }));
  }