javascript - Angular 4 : setValue formBuilder empty array

我有这样的 react 形式:

constructor(...){
  this.form = this.formBuilder.group({
    name: ['', Validators.compose([Validators.required, Validators.maxLength(50)])],
    memes: this.formBuilder.array([
      this.initMemes('TrollFace')
    ])
  });
}

initMemes (name?) {
  return this.formBuilder.group({
    id: [''], name: [name]
  });
}

稍后我可以添加更多memes:

addMemes () {
  const control = <FormArray>this.form.controls['memes'];
  control.push(this.initMemes('anyName'));
}

然后，如果我得到表单值，我得到:
this.form.controls['memes'].value-在这里我有数组

但是有一种情况，当我需要将此this.form.controls['memes'].value设置为空数组时，怎么办？

如果我这样设置:
this.form.controls['memes'].setValue([])
我收到错误消息:Must supply a value for form control at index: 0.
我做错了什么？

最佳答案

编辑:

从较新版本开始，Angular现在支持使用FormArray清除clear():

(<FormArray>this.form.get('memes')).clear();

原文:

尝试了一些事情:reset()，setControl()，但是以下是我发现可以使用的唯一解决方案，该解决方案实际上将整个数组重置为[]，其他选项也有效，但它们保留了表单组，只是清空了值。

因此，如何使它起作用，是迭代表单数组并删除循环中具有该特定索引的每个表单组:

const control = <FormArray>this.form.controls['memes'];

for(let i = control.length-1; i >= 0; i--) {
  control.removeAt(i)
}

如果有更好的方法，欢迎您提出建议! :)

关于javascript - Angular 4 : setValue formBuilder empty array，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44280926/