Question

在我的表单中，我具有三个可以动态添加和删除的字段。我已经完成了这一部分。工作正常。但是我想从数据库中向该字段添加值。但这显示了错误

  this.CreateEAuctionForm.get('upins').patchValue({
        mediaTyp: res[0].mtype,
        land:res[0].land
      });

我尝试了上面的代码，但给出了错误

错误TypeError：value.forEach不是位于的函数 FormArray.push ../ node_modules/@angular/forms/fesm5/forms.js.FormArray.patchValue

Answer 1

您现在正在尝试将一个对象（表单组）设置为formarray的值。 Angular会对此抱怨。如果确定您的表单数组中始终有一个表单组，则应修补该表单组上的值。就像“普通”数组一样，它在索引0上。但是对于保险，让我们检查是否存在一个表单组，如果存在，则对值进行修补，否则将新的表单组推送到表单数组中：

 const formArr = <FormArray>this.CreateEAuctionForm.get('upins');

 // check that there is a formgroup inside the formarray at index 0
 if (formArr.at(0)) {
   formArr.at(0).patchValue({
     mediaTyp: res[0].mtype,
     land:res[0].land
   });
 } else {
   formArr.push(this.fb.group({
     mediaTyp: res[0].mtype,
     land:res[0].land
   }))
 }

...，其中fb指FormBuilder。

演示：StackBlitz

Answer 2

发布此信息，以便将来对某人有所帮助
@ AJT_82 提供的解决方案是正确的。但是我有几个值，所以我找到了可以通过formarray索引的解决方案。

    const formArr = <FormArray>this.CreateEAuctionForm.get('upins');

 // check that there is a formgroup inside the formarray at index 0
 if (formArr.at(id)) {
   formArr.at(id).patchValue({
     mediaTyp: res[0].mtype,
     land:res[0].land
   });
 } else {
   formArr.push(this.fb.group({
     mediaTyp: res[0].mtype,
     land:res[0].land
   }))
 }

此处 id 是动态创建的formarray的索引。
感谢您 AJT_82P 为您提供的解决方案。它对我很有帮助。

如何将值添加到表单数组中的输入字段

2 个答案: