FormGroup控件中的模型驱动窗体嵌套FormArray控件

edu*_*000 5 forms typescript angular

我有一个这样的表单组:

 this.form = fb.group({
  'teacher': [''],
  'schools': fb.array([
      fb.group({
        'school_name': [''],
        'school_description': [''],
        'events': fb.array([
          fb.group({
            'event_name': ['']
          })
        ])
      })
  ])
});
const control = (<FormArray>this.form.controls['schools']).controls[0]['events'];
Run Code Online (Sandbox Code Playgroud)

如何获得嵌套数组控件'事件'?

const control = (<FormArray>this.form.controls['schools']).controls[0]['events'];
Run Code Online (Sandbox Code Playgroud)

ste*_*nja 5

我建议您查看嵌套表单数组嵌套表单组的Angular 2示例,以了解如何构建复杂表单.使用FormGroup,您可以使用它.get(name: string)来检索控件.此示例获取schoolsFormArray控件:

this.form.get('schools')
Run Code Online (Sandbox Code Playgroud)

对于FormArray,您可以使用从数组中检索控件.at(index: number).此示例获取数组中的第一个FormGroup控件:

this.schools.at(0)
Run Code Online (Sandbox Code Playgroud)

总而言之,有更好的(阅读:更可重复,更易读)的方式表达这一点,但这个链将让你从第一所学校的第一个事件:

this.form.get('schools').at(0).get('events')
Run Code Online (Sandbox Code Playgroud)

这是一个有效的plnkr示例.