尝试在 Angular 中添加子 FormGroup 时出现错误 TS2339答案

【问题标题】：error TS2339 when trying to add child FormGroup in Angular尝试在 Angular 中添加子 FormGroup 时出现错误 TS2339
【发布时间】：2020-02-19 12:41:59
【问题描述】：

我正在使用 Angular8 并尝试使用 addControl 将子 FormGroup 添加到表单：

    this.testForm = new FormGroup({
        id: new FormControl(0),
        people: new FormGroup({
        }),
    });
    this.testForm.controls['people'].addControl('numbers', new FormGroup({
        number: new FormControl('1234')
    }));

这给了我编译器错误： error TS2339: Property 'addControl' does not exist on type 'AbstractControl'.

真的坚持这一点，所以大家都非常感谢！

【问题讨论】：

标签： angular formgroups angular-abstract-control

【解决方案1】：

AbstractControl 的 FormGroup 扩展类具有 addControl，并且此方法不是父类 AbstractControl 的一部分。所以当你使用get方法时，返回的元素是AbstractControl，而不是FormGroup，所以你应该确保返回的元素是FormGroup，并正确地转换它以使用addControl方法。

考虑到这一点，您可以使用 addControl，在代码中添加如下内容：

abstractControl : AbstractControl = this.formGroup.get(tab.id);
if(abstractControl instanceof FormGroup){
    (<FormGroup>abstractControl).addControl(segment.id, this.formBuilder.group({}));
}

【讨论】：

【解决方案2】：

类型断言应该足够了：而不是

    this.testForm.controls['people'].addControl( // ...

做

    (this.testForm.controls['people'] as FormGroup).addControl( //...

【讨论】：