编程语言
首页 > 编程语言> > javascript-更改嵌套表单中的FormBuilder数组项

javascript-更改嵌套表单中的FormBuilder数组项

作者:互联网

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

myForm.patchValue({‘key’:{‘subKey’:’newValue’}}));

但是如何在下面的示例中更改嵌套数组(例如汽车列表)中的值.如何获得列表数组的第一项更改为嘉年华模型? 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

解决方法:

我不久前做了类似的事情,只是添加.

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

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

标签:javascript,angular,angular2-forms
来源: https://codeday.me/bug/20191009/1879941.html