使用默认表单值可避免此错误。

而不是使用在ngAfterViewInit()中应用detectChanges()的接受答案(这也解决了我的情况下的错误)，我决定为动态所需的表单字段保存一个默认值，这样当表单稍后更新时，如果用户决定更改表单上的选项，将触发新的必需字段(并导致提交按钮被禁用)，它的有效性不会改变。

这在我的组件中节省了一小部分代码，在我的案例中，错误完全避免了。

正如@leocaseiro在github上提到的那样。

我为那些正在寻找简单解决方案的人找到了3个解决方案。 1)从ngAfterViewInit移动到ngAfterContentInit 2)移动到ngAfterViewChecked结合ChangeDetectorRef as 建议在#14748(评论) 3)继续使用ngOnInit()，但之后调用ChangeDetectorRef.detectChanges() 您的更改。

我得到了这个错误，因为我声明了一个变量 使用ngAfterViewInit改变了它的值

export class SomeComponent {

    header: string;

}

来修复我从

ngAfterViewInit() { 

    // change variable value here...
}

to

ngAfterContentInit() {

    // change variable value here...
}

使用默认表单值可避免此错误。

而不是使用在ngAfterViewInit()中应用detectChanges()的接受答案(这也解决了我的情况下的错误)，我决定为动态所需的表单字段保存一个默认值，这样当表单稍后更新时，如果用户决定更改表单上的选项，将触发新的必需字段(并导致提交按钮被禁用)，它的有效性不会改变。

这在我的组件中节省了一小部分代码，在我的案例中，错误完全避免了。

你可以使用µsetTimeout()在javascript事件循环的下一个宏任务队列中运行属性的设置。 但是在这种情况下，使用detectChanges()就足够了。出现这种错误的原因有很多:

本文解释了产生此错误的所有原因以及此错误的所有解决方案:https://blog.simplified.courses/angular-expression-changed-after-it-has-been-checked-error/

我认为你能想到的最好和最干净的解决方案是:

@Component( {
  selector: 'app-my-component',
  template: `<p>{{ myData?.anyfield }}</p>`,
  styles: [ '' ]
} )
export class MyComponent implements OnInit {
  private myData;

  constructor( private myService: MyService ) { }

  ngOnInit( ) {
    /* 
      async .. await 
      clears the ExpressionChangedAfterItHasBeenCheckedError exception.
    */
    this.myService.myObservable.subscribe(
      async (data) => { this.myData = await data }
    );
  }
}

用Angular 5.2.9测试过