Angular 4 patchValue 基于 FormArray 中的索引

Question

我希望在用户在创建的空控件中添加值后更新 formArray。

目前，当用户选择添加一个新项目时，我会使用空值构建到 formArray 上。

buildItem(item?: any, key?: any): FormGroup {
  // Item will pass undefined for initial buildItem in onLoad and new items
  let itemName: string;
  let keyValue: string;
  if (item === undefined) { 
     itemName = ''; key = '' }  
  else { 
     itemName = item.name; keyValue = key 
  };

  /**
   * Builds a single item for form group array in the collectionForm.
   */
   return this.formBuilder.group({ 
                item: [itemName || '', Validators.required], 
                properties: { item, key: key } || {} });
}

这适用于初始创建和更新已添加的项目。问题在于添加了空值的新项目。当我添加一个新项目时，我需要在 properties.key

中添加来自 firebase 的返回键

在保存该新项目的方法中，我添加了一个 patchValue

this.items.patchValue([{ 
         // item being returned from firebase promise
         item: item.name, 
         properties: { item: item.name, key: item.$key' } 
}]);

但是 patchValue 根本不起作用。当我尝试更新该新值时，尽管这些值已保存到 firebase，但我仍然会返回空值或在初始 BuildItem() 上设置的保存值而不是更新值在 patchValue

中

我在 Angular FormArray 文档中看到

It accepts an array that matches the structure of the control, and will do its best to match the values to the correct controls in the group. REF

这是否意味着它可能会也可能不会更新该值.. 它只会尽力尝试？我想如果我可以为我想要修补的值添加索引，那么它根本就不是问题。就像 removeAt(idx)

所以如果我可以写类似的东西

this.form.patchValue.atIndex(this.idx,[{ 
         item: item.name, 
         properties: { item: item.name, key: item.$key' } 
}];

但我不确定我能做到这一点.. 很确定在那种形式下是不可能的。有什么方法可以专门针对在 formArray 中修补的项目，或者我可能没有正确理解这一点。

我可以通过将新值推送到 formArray

来解决这个问题

this.items.push(this.buildItem(...));

但是我必须添加

this.items.removeAt(this.idx); 

为了删除对空构建的初始控制，这看起来不像任何类型的好代码。

Answer 1

使用FormArray#at + AbstractControl#patchValue :

this.items.at(index).patchValue(...);

DEMO