Angular 2 数据驱动表单

this.myForm = this.formBuilder.group

使用用户的配置创建一个表单对象，并将其分配给 this.myForm 变量。

'loginCredentials': this.formBuilder.group

method 创建一组控件，由一个 formControlName 组成，例如。login 和 value ['', Validators.required],，其中第一个参数是表单输入的初始值，secons 是验证器或验证器数组，如'email': ['', [Validators.required, customValidator]], 中所示。

'hobbies': this.formBuilder.array

创建一个组数组，其中组的索引是数组中的 formGroupName ，并且访问方式如下：

<div *ngFor="let hobby of myForm.find('hobbies').controls; let i = index">
   <div formGroupName="{{i}}">...</div>
</div>

onAddHobby() {
    (<FormArray>this.myForm.find('hobbies')).push(new FormGroup({
      'hobby': new FormControl('', Validators.required)
    }))
  }

此示例方法将新 formGroup 添加到数组中。当前访问需要指定我们想要访问的控件类型，在此示例中，此类型为：<FormArray>

removeHobby(index: number){
    (<FormArray>this.myForm.find('hobbies')).removeAt(index);
  }

与上述相同的规则适用于从数组中删除特定的表单控件