如何在另一个FormGroup内部的FormGroup内部访问FormArray？

Question

我有一系列数据如下：

[
    {
      id: "1",
      name: "task1",
      taskForms: [
        {
          id: "8782",
          name: "ProcedureComment",
          sortOrder: null,
          description: "Comment for 'Procedure end / Suture' task",
          label: null
        },
        {
          id: "20",
          name: "form20",
          description: "form20 description",
          label: "form20 lable"
        }
      ]
    },
    {
      id: "2",
      name: "task2",
      taskForms: [
        {
          id: "87822",
          name: "ProcedureComment2",
          sortOrder: null,
          description: "Comment for 'Procedure end / Suture' task2",
          label: null
        },
        {
          id: "202",
          name: "form202",
          description: "form202 description",
          label: "form202 lable"
        }
      ]
    }
  ];

我想将taskforms转换为formarray（）。

我是否必须将任务标记为formgroup，然后标记 taskforms 为formarray？我该怎么做？

public formGroup = new FormGroup({
    tasks: new FormControl([]) 
//==>> i need it first as FormControl then i want to convert it and write data inside.
  });

我尝试了：

    this.formGroup.setControl('tasks', this.formBuilder.group(tasks));

但是我无法正常工作。

Answer 1

嵌套FormGroup中的FormArray

您只需使用formBuilder使您的生活更轻松：

constructor(private fb: FormBuilder) {}

ngOnInit(): void {
  this.formGroup = this.fb.group({
    nested_formgroup: this.fb.group({
      array: this.fb.array([
        { example: ['']}
      ])
    })
  })
}

结果

{
  "nested_formgroup": {
    "array": [
      {
        "example": ""
      }
    ]
  }
}

加载数据

以加载您只需将对象映射到value成员所需的数据formControls

loadData() {
  this.someService.getData().subscribe(
    data => {
      this.formGroup.get('nested_formgroup').get('array').value[0].example = data.example
    }
  )
}

这是 stackblitz for您要测试/玩。