Как обновить элементы управления FormArray

Мой групповой код формы равен

this.myForm = this._fb.group({            
            branch_name: ['', [Validators.required]],
            branch_timing: this._fb.array([
                this.initBranchTiming(),
            ])                                
        });

initBranchTiming() {       
        return this._fb.group({
            day: ['', []],
            open_from: ['00:00:00', []],
            open_till: ['00:00:00', []]           
        });
  }

имя_индулятора обновляется с помощью этого кода

(<FormControl>this.myForm.controls['branch_name']).updateValue(this.branch_detail.branch_name);

Теперь мне нужно обновить поле "день" массива формы. что делать, чтобы обновить поле "день" в виде массива branch_timing?

Ответ 1

AFAIK, помещая FormGroup внутри FormArray, разбивает 'FormControls' своих имен и делает его просто списком, как обычный массив.

Чтобы обновить FormControls индивидуально, вы обновляете значение каждого AbstractControl из FormGroup с помощью индекса:

let index = 0; // or 1 or 2
(<FormArray>this.myForm.controls['branch_timing']).at(index).patchValue('example');

Или вы можете обновить весь FormArray, вызвав setValue или patchValue:

(<FormArray>this.myForm.controls['branch_timing']).setValue(['example', 'example1', 'example2']);

setValue требуется массив, который соответствует всей структуре или FormArray, а patchValue может принимать супер-набор или подмножество массива. (FormArray-класс на веб-сайте Angular2)

Ответ 2

Это проверено и работает на Angular 2.0.0-rc.4 с @angular/forms 0.2.0:

(<FormControl>this.myForm.controls.branch_timing.controls[0].controls.day)
  .updateValue('new value');

В версии выпуска Angular 2.0.0 с @angular/forms 2.0.0 синтаксис упрощен:

this.myForm.value.branch_name = this.branch_detail.branch_name;

this.myForm.value.branch_timing[0].day = 'New Value';

Ответ 3

Вы можете сделать это, просто создав новый FormControl:

this.form.setControl('items',  new FormControl(arrayItemsValue));

Или удалив все элементы перед их обновлением:

const items = (<FormArray>this.form.get('items'));
 for (let i = 0; i < items.length; i++) {
     items.removeAt(i);
 }
 this.form.get('items').setValue(arrayItemsValue);

Ответ 4

Не проверено, но я думаю, что это должно делать то, что вы хотите:

this.myForm.get('branch_name.0.day')
.setValue(this.branch_detail.branch_name);

Ответ 5

Попробуйте, надеюсь, что это сработает для вас:

 this.myForm.controls.splice(0);