如何在不触发表单更改事件的情况下将 FormGroup 添加到 FormArray

Question

我用任何空数组初始化表单，definitionProperties如何更新FormGroup？我需要在不触发更改事件的情况下执行此操作，否则会导致valueChanges可观察对象中的无限循环。

this.gridProcessorForm = this.fb.group({
    propertiesSide: new FormControl(),
    objectNamesSide: new FormControl(),
    definitionProperties: this.fb.array([])
});

这会导致无限循环：

this.gridProcessorForm.valueChanges.subscribe(val => {
    let propertyGroups: FormGroup[] = [];
    for (let property of this.objectDefinition.properties) {
      let group = this.createPropertyFormGroup(property);
      (this.gridProcessorForm.get('definitionProperties') as FormArray).push(group); // triggers change event so infinite loop
    }
});

当使用 setValue with{ emitEvent: false }覆盖 FormArray 时，它会出错。

this.gridProcessorForm.valueChanges.subscribe(val => {
  if (this.gridSideSelection = 'top') {        
    let propertyGroups: FormGroup[] = [];
    for (let property of this.objectDefinition.properties) {
      let group = this.createPropertyFormGroup(property);
      propertyGroups.push(group);
    }

    (this.gridProcessorForm.get('definitionProperties') as FormArray).setValue(propertyGroups, { emitEvent: false });
  }
});

我收到此错误：

There are no form controls registered with this array yet. 

似乎需要表单构建器使用 FormArray 中的组进行初始化？但我想用所有内容初始化表单。

Answer 1

我希望这会有所帮助，因为这是我正在运行的代码。

    let containersArray = <FormArray>this.formName.controls['containers'];
    containersArray.push(this.addContainerInitialize(container));


addContainerInitialize(value) {

    return this.fb.group({
        containerNumber: [value.containerNumber],
        conType: [value.conType, Validators.required],
        quantity: [value.noOfContainers, Validators.required],
        weight: [value.grossWeight, Validators.required]
    });
}