Angular 7 Reactive forms - 将 FormArray 中的表单组链接到对象答案

【问题标题】：Angular 7 Reactive forms - link form group in FormArray to objectAngular 7 Reactive forms - 将 FormArray 中的表单组链接到对象
【发布时间】：2019-01-29 01:33:17
【问题描述】：

我正在创建表单组的表单数组

const skillsControl = <FormArray>this.form.controls['skills'];

this.selectedCourse.requiredSkills.forEach(skill => {
    const s = this.fb.group({
                instructor: ['', Validators.required],
                ...other controls...
              });
    skillsControl.push(s);
}

每个选定的课程都有一套独特的技能。

我需要能够显示技能的名称，然后是与该技能关联的表单控件。

如何将所需的技能对象与其各自的表单组相关联？

【问题讨论】：

标签： angular angular-reactive-forms

【解决方案1】：

你必须以这种方式定义你的表单：

  const items = new FormArray(this.skills.map(item => new FormGroup({
                name: new FormControl(item.name),
                instructor: new FormControl(item.instructor)
  })));

  this.myForm = new FormGroup({items: items});

我在 stackblitz 中做了一个完整的例子：

Form Array exmple

希望对你有帮助！

【讨论】：

不完全是我所追求的，但它帮助我到达了我想去的地方。谢谢你。