如何将新的表单控件添加到嵌套表单组？答案

【问题标题】：How can I add a new form control to the nested form group?如何将新的表单控件添加到嵌套表单组？
【发布时间】：2017-10-30 00:43:17
【问题描述】：

我有这个表单组：

this.form = fb.group({
  'teacher': [''],
  'schools': fb.array([
    fb.group({
      'school_name': [''],
      'school_description': [''],
    })
  }) 
});

问题是：

如何通过函数以编程方式将新的表单控件（名为school_city）添加到FormArray 的特定*组？

【问题讨论】：

您想将新的group 添加到schools 数组吗？这是吗？
我想在学校数组内的组中添加一个名为 school_city 的控件。
还有什么问题？为什么它不起作用？是不是像您为school_name 和其他人所做的那样简单地输入school_city？
我想通过函数调用来添加。
嗯，既然您在数组中，您可能希望为每组学校添加此控件？此外，问题是缺乏信息。如果您可以在您的问题中包含这些 cmets，那将会很有用。

标签： angular angular2-forms angular-reactive-forms

【解决方案1】：

要为FormArray 中的每个组添加一些控件，您可以执行以下操作：

someFunc() {
  const formArr = this.form.get('schools') as FormArray;

  for (const group of formArr.controls) {
    group.addControl('school_city', this.fb.control(''));
  }
}

PLUNKER

编辑#1：

正如 OP 现在解释说他想将 control 添加到特定组：

您必须传递要添加的组的索引control：

someFunc(idx: number) {
  const group = this.form.get(`schools.${idx}`) as FormGroup;

  group.addControl('school_city', this.fb.control(''));
}

【讨论】：

对不起，这解决了我的问题。我怎样才能添加控制 school_city，只有当你点击添加学校城市按钮时？现在每个组都添加了控制 school_city。其实我不想变成这样。
@kartik 伙计，昨天您确认要将其添加到每个控件中（您可以在帖子的 cmets 中看到我提出的问题）。反正太容易完成了，看编辑版。
另外，是否有任何理由删除赞成和接受的答案？
嗨，实际上我只想为特定组添加表单控件（基于条件）。如果你愿意，我可以分享我的代码
是的，我尽力指定我想要的。您假设应该为每组数组添加它。我想我实际上可以用你的解决方案做到这一点。但我做不到。我再次投票。 tnx 为您的努力。