将FormArray设置为FormGroups数组

Question

如何设置FormGroup的FormArray？我想设置表单的definitionProperties (FormArray)。

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

FormGroups的FormArray：

let propertyControls: FormGroup[] = [];
propertyControls = getFormGroups(); // set definitionProperties to this

我找到了一些代码，可以逐个添加，但如果可能的话，我想使用一个数组来设置，而不是使用push来设置一个值：

(this.gridProcessorForm.get('definitionProperties') as FormArray).push(group)

getFormGroups()函数构建一个组数组：

createPropertyFormGroup(definitionProperty: ObjectDefinitionProperty) {
   let formGroup = this.fb.group({
      propertyName: definitionProperty.name,
      propertyType: definitionProperty.type.name,
      gridOffset: 1
   });
   return formGroup;
}

FormArray的设置在可观察值中：

this.gridProcessorForm.valueChanges.subscribe(...)

Answer 1

对于初始设置，请尝试此操作

this.processorForm = this.fb.group({
    propertiesSide: new FormControl(),
    objectNamesSide: new FormControl(),
    definitionProperties: this.fb.array([
         this.fb.group({
             propertyName: definitionProperty.name,
             propertyType: definitionProperty.type.name,
             gridOffset: 1
         })
   })])
});

使用此选项可添加更多内容：

 var _definitionProperties= <FormArray>this.processorForm .controls.definitionProperties;
_definitionProperties.push({
       this.fb.group({
             propertyName: 'Name',
             propertyType: 'Type',
             gridOffset: 1
         })
 })

有关更多信息，请阅读以下内容：https://medium.com/@m.kunwa52/reactive-form-in-angular-with-formarray-2595e5ee1d31