如何在表单数组中添加无效的表单控件而不影响其功能

我想创建一个动态表单，将表单控件（必需的表单控件）添加到表单数组中。

表单控件无效，因为它需要由用户填写（为空）

但是当我添加表单控件时，出现错误

ExpressionChangedAfterItHasBeenCheckedError：表达式在检查后已更改。以前的值：'ng-valid：true'。当前值：'ng-valid:false'

在控制台中。

add(formControl) {
    (this.formGroup.get('array') asFormArray).push(formControl)
}

您只需要在添加无效的子表单后手动调用更改检测即可。变更检测是自上而下进行的。根据该错误判断，当单击按钮（或您用来添加新表单的任何内容）更改检测周期运行时，它在到达新添加的无效子表单时已经检查了表单有效性。在添加新表单后手动调用它会告诉 Angular 将需要第二个更改检测周期，因为更高层元素中的表达式很可能已更改。

constructor(private readonly cdr: ChangeDetectorRef) {}

add(formControl) {
  (this.formGroup.get('array') asFormArray).push(formControl);
  this.cdr.detectChanges();
}