循环访问包含表单数组的表单组

Question

我正在创建一个具有以下结构的动态模型驱动表单：

export class AppComponent {
data = {
companies: [
{
company: "example comany",
projects: [
{
projectName: "example project",
}
]
}
]
}
myForm: FormGroup;
constructor(private fb: FormBuilder) {
this.myForm = this.fb.group({
companies: this.fb.array([])
})
this.setCompanies();
}
setCompanies() {
let control = <FormArray>this.myForm.controls.companies;
this.data.companies.forEach(x => {
control.push(this.fb.group({ 
company: x.company, 
projects: this.setProjects(x) }))
})
}
setProjects(x) {
let arr = new FormArray([])
x.projects.forEach(y => {
arr.push(this.fb.group({ 
projectName: y.projectName 
}))
})
return arr;
}
}

下面是模型结构，在可观察量中，我从后端接收数据：

export class Companies{
company : String;
companyRegNo : String;
projects : Project[];
}
export class Project{
projectName : String;
projectRegNo : String;
}

我的"myForm"FormGroup变量中有一些 json 数据，其中包含包含公司和项目名称的信息。我需要在这个 json 中进行一些更新，但要提供原始myFormjson 数据。

因此，我正在创建另一个FormGroup变量myForm2并为其分配myForm值：

myForm2: FormGroup;
this.myForm2 = this.myForm;

现在，我希望将company值替换为companyRegNo值，并将projectName值替换为projectRegNo保持键company的值，projectName保持原样，在myForm2中保持原样。

我已经有 2 种方法，getProjectRegNoFromProjectName()和getCompanyRegNoFromCompanyName()可用，它们分别返回通过projectName和company的projectRegNo和companyRegNo。我需要在迭代 myForm2 时调用这两个方法。 现在如何迭代myForm2数据本身，以便可以更新分配的属性和FormArray值，如前所述？

Answer 1

你试过使用 patchValue 吗？ 像这样：

(<any>Object).values(formGroup.controls).forEach(control => {
control.patchValue(value);
//Patch Your value here}

Answer 2

您可以在嵌套表单数组上参考我的这个简单示例。

https://stackblitz.com/edit/nested-form-array-example?embed=1&file=src/app/app.component.ts

如有疑问，请随时询问。