显示动态嵌套表单组/表单数组

【问题标题】：Displaying dynamic nested formgroup/formarray显示动态嵌套表单组/表单数组
【发布时间】：2022-06-15 12:23:49
【问题描述】：

我有一个具有以下结构的表单组：

this.myForm = this.formBuilder.group({
  firstGroup: this._fb.group({
     isEnabled: [false, Validators.required],
     firstArray: this._fb.array([])
  }),
  secondGroup: this._fb.group({
     isEnabled: [false, Validators.required],
     secondArray: this._fb.array([])
  }),
  thirdGroup: this._fb.group({
     isEnabled: [false, Validators.required],
     thirdArray: this._fb.array([])
  }),
  firstName: ['', Validators.required],
  lastName: ['', Validators.required]
})

我有来自后端的数据，我想将这些数据填充到嵌套的 formArrays 中，即 firstArray、secondArray、thirdArray

我目前尝试的方法如下：

this.myForm.get('firstGroup.firstArray').setValue(data.firstArray)
this.myForm.get('firstGroup.isEnabled').setValue(data.isEnabled)

但是这样做会产生以下错误：

value.forEach is not a function

我以前使用过动态表单，但它们不是这样嵌套的。任何关于我在哪里出错的帮助将不胜感激。

createItem() {
  return this.formBuiler.group({
      temp1: [{
          key1: null,
          key2: null,
      }],
      temp2: [{
          key3: null,
          key4: null,
      }],
  })
}

formarray 是上面给出的对象数组（此方法称为第一项为 formArray 创建项）

【问题讨论】：

• Form.get(['temp1', 'key1'])

标签： angular angular-reactive-forms formarray formgroups