以嵌套形式更改FormBuilder数组项 [英] Change FormBuilder array items in nested forms

问题描述

根据API文档，更改嵌套值的正确方法是使用方法 patchValue

According to the API documentation the proper way to change nested values is to use method patchValue

myForm.patchValue（{'key'：{'subKey'：'newValue'}}）;

但如何在下面的示例中更改嵌套数组中的值，例如汽车的列表。如何将列表数组的第一项更改模型更改为 Fiesta ？ Plunker

But how to change values in nested arrays like list of cars in this example below. How to get first item of list array an change model to Fiesta? Plunker

myForm.patchValue（{'list'：0：{'model'：'Fiesta'}）; 无效。

@Component({
  moduleId: __moduleName,
  selector: 'my-app',
  template: `<div><pre>{{ myForm.value | json }}</pre></div>`
})
export class AppComponent {

  public myForm: FormGroup;

  constructor(@Inject(FormBuilder) private _fb: FormBuilder) {

    this.myForm = this._fb.group({
      name: 'Cars',
      list:  this._fb.array([
        this.initCar(),
        this.initCar(),
        this.initCar()
      ]),
    });
    /** Change value Here **/
    this.myForm.patchValue({name: 'Automobile'});
  };

  initCar() {
    return this._fb.group({
      automaker: 'Ford',
      model:     'Fusion'
    });
  }
}

Plunker

推荐答案

我做了些什么类似的不是很久以前只是添加。

I did something similar not that long ago just add.

const patchV = (<FormArray>this.myForm.controls['list']).at(0) as FormArray;
patchV.patchValue({automaker: 'CoolCar', model: 'Bucket'})

工作实例[plunker] http://embed.plnkr.co/VWicnA/

Working Example [plunker]http://embed.plnkr.co/VWicnA/

这篇关于以嵌套形式更改FormBuilder数组项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！