angular - 如果从父级重新初始化 FormGroup，则自定义组件 FormControl 会中断

Question

从我的自定义组件中使用的父组件重新初始化 formGroup 时遇到问题。我得到的错误是:

There is no FormControl instance attached to form control element withname: 'selectedCompany'

HTML:

<form [formGroup]="addForm">
     ...
     <my-custom-component formControlName="selectedCompany"></my-custom-component>
     ...
</form

<my-custom-component>根据创建自定义 formControl 组件的有效方式创建:https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html#implementing-controlvalueaccessor

组件

这是初始化 formGroup 变量 addForm 的代码:

let formTemp: any = {
    selectedCompany: new FormControl(null, [Validators.required]),
}

this.addForm = this._formBuilder.group(formTemp);

第一次addForm初始化一切正常。但是当我重新打开窗体所在的模态并执行相同的组件代码时，会出现上述错误。

Answer 1

我发现一遍又一遍地重新初始化 formGroup 是不好的，因为组件丢失了对旧 formGroup 的引用。

如果设置值是显示新表单所需要的，.setValue 是这里的解决方案:

组件

不是重新初始化 addForm，而是检查 addForm 之前是否已初始化，如果是，则只为现有的 FormControls 设置值:

if (this.addForm) {
    this.addForm.setValue({
        selectedCountry: null
    })
} else {

    let formTemp: any = {
        selectedCompany: new FormControl(null, [Validators.required]),
    }

    this.addForm = this._formBuilder.group(formTemp);
}

这样，我想，引用不会丢失到旧的 addForm，所以不会发生错误。