Question

我有一个简单的列表 - string[]。我为该列表的每个项目生成复选框。然后我创建FormControls：

this.list.map((item) => {
  this.form.addControl(item, new FormControl(false, Validators.required))
})

但是我想添加一个Validator来控制允许的已选中复选框的数量，所以我假设如果我将FormControls移到FormGroup，我就可以这样做，所以我试试类似的东西：

  constructor(private fb:FormBuilder) { 
        this.form = this.fb.group({
          input1Ctrl: ['', Validators.required],
          input2Ctrl: ['',Validators.required],
          checkboxGroup : new FormGroup({})   
        })         
        this.list.map((item) => {
          this.form.checkboxGroup.addControl(item, new FormControl(false, Validators.required))
        })

但是这给了：

提供的参数与呼叫目标的任何签名都不匹配。 Property＆＃39; checkboxGroup＆＃39;类型＆＃39; FormGroup＆＃39;。
上不存在

我该怎么做？

Answer 1

访问checkboxGroup，例如this.form.controls['checkboxGroup']。

  constructor(private fb:FormBuilder) { 
            this.form = this.fb.group({
              input1Ctrl: ['', Validators.required],
              input2Ctrl: ['',Validators.required],
              checkboxGroup : new FormGroup({})   
            })         
            this.list.map((item) => {
              this.form.controls['checkboxGroup'].addControl(item, new FormControl(false, Validators.required))
            })

编辑：为上述

创建了plunker

https://plnkr.co/edit/nxo52y?p=preview

Answer 2

您在这里使用的是{{imagen}}，而不是formBuilder的FormGroup方法。

似乎您将其设置为：

group

访问FormBuilder的this.form = this.fb.group({ checkboxGroup: this.fb.group({}) })和group都对我有用： FormGroup 和 `this.form.controls ['checkboxGroup']

请参见https://angular.io/api/forms/FormBuilder#control

Angular - 将动态创建的FormControls添加到FormGroup中

2 个答案: