后端以角度 2 生成嵌套的 JSON formArray 和 formGroup

Question

我想用对象数组生成 JSON 驱动的表单，目前stackbiz 正在处理单个对象 json (person.js)，我正在尝试使用以下 JSON 数组修改 person.ts

对于json

[{
  name: {
    label: 'Name',
    value: 'Juri',
    type: 'text',
    validation: {
      required: true
    }
  },
  age: {
    label: 'Age',
    value: 32,
    type: 'text'
  },
  gender: {
    label: 'Gender',
    value: 'M',
    type: 'radio',
    options: [
      { label: "Male", value: 'M'},
      { label: "Female", value: 'F'}
    ]
  }, 
  city: {
    label: 'City',
    value: '39010',
    type: 'select',
    options: [
      { label: "(choose one)", value: ''},
      { label: "Bolzano", value: '39100'},
      { label: "Meltina", value: '39010'},
      { label: "Appiano", value: '39057'}
    ],
    validation: {
      required: true
    }
  }
},
{
  name: {
    label: 'Name',
    value: 'Juri1',
    type: 'text',
    validation: {
      required: true
    }
  },
  age: {
    label: 'Age',
    value: 32,
    type: 'text'
  },
  gender: {
    label: 'Gender',
    value: 'M',
    type: 'radio',
    options: [
      { label: "Male", value: 'M'},
      { label: "Female", value: 'F'}
    ]
  }
}]

所以模板输出应该是这样的（包括两个部分）

我在上面的多对象 json 中面临的问题是我遍历对象数组并在循环中使用新的 formControl 创建 formGroup，然后尝试在循环外推入 formArray 但没有成功，感谢任何帮助或建议，我卡在 formArray 与 FormBuilder 与 FormGroup 中，现在大脑无法正常工作:(

这是我正在尝试修改的 plunker 链接：https://stackblitz.com/edit/angular-dynamicforms-blogarticle-fjkjx4

Answer 1

您可以创建一个空的 formArray 来存储响应。
https://stackblitz.com/edit/angular-dynamicforms-blogarticle-jns9xq

public formResponses: FormArray = new FormArray([]);

  onSubmit(form) {
    if (form.valid) {
      this.formResponses.push(new FormControl(form.value));
    }
  }