请向我解释为什么我一直得到这个错误:ExpressionChangedAfterItHasBeenCheckedError:表达式已经改变后，它被检查。
显然，我只有在开发模式下才会遇到这种情况，在我的产品构建中不会出现这种情况，但这非常烦人，而且我根本不明白在我的开发环境中出现错误而不会在prod上显示的好处——可能是因为我缺乏理解。
通常，修复很简单，我只是把导致错误的代码包装在setTimeout中，就像这样:
setTimeout(()=> {
this.isLoading = true;
}, 0);
或者使用如下构造函数强制检测更改:
this.isLoading = true;
this.cd.detectChanges();
但是为什么我总是遇到这个错误呢?我想要了解它，这样我就可以在将来避免这些俗套的修复。
当前回答
我得到这个错误，因为我在component.html中使用了一个没有在component.ts中声明的变量。一旦我删除了HTML中的部分，这个错误就消失了。
其他回答
我希望这能帮助到在座的各位: 我们在ngOnInit中以以下方式调用服务，并使用一个变量displayMain来控制元素到DOM的挂载。
component.ts
displayMain: boolean;
ngOnInit() {
this.displayMain = false;
// Service Calls go here
// Service Call 1
// Service Call 2
// ...
this.displayMain = true;
}
和component.html
<div *ngIf="displayMain"> <!-- This is the Root Element -->
<!-- All the HTML Goes here -->
</div>
当我添加*ngIf时，我的问题很明显，但这不是原因。该错误是由于在{{}}标签中更改模型，然后稍后尝试在*ngIf语句中显示更改后的模型而导致的。这里有一个例子:
<div>{{changeMyModelValue()}}</div> <!--don't do this! or you could get error: ExpressionChangedAfterItHasBeenCheckedError-->
....
<div *ngIf="true">{{myModel.value}}</div>
为了解决这个问题，我将调用changeMyModelValue()的位置更改为更有意义的位置。
在我的情况下，我希望每当子组件更改数据时调用changeMyModelValue()。这要求我在子组件中创建并发出一个事件，以便父组件可以处理它(通过调用changeMyModelValue())。看到https://angular.io/guide/component-interaction parent-listens-for-child-event
对于我的问题，我正在阅读github -“在afterViewInit中更改组件“非模型”值时的ExpressionChangedAfterItHasBeenCheckedError”，并决定添加ngModel
<input type="hidden" ngModel #clientName />
它解决了我的问题，我希望它能帮助到别人。
我面临着同样的问题，因为我的组件中的一个数组的值发生了变化。但是我没有检测值变化的变化，而是将组件变化检测策略改为onPush(它将检测对象变化的变化，而不是值变化的变化)。
import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush
selector: -
......
})
解决方案…服务和rxjs…事件发射器和属性绑定都使用rxjs..你最好自己实现它，更多的控制，更容易调试。记住，事件发射器使用rxjs。简单地说，创建一个服务，并在一个可观察对象中，让每个组件订阅该观察对象，并根据需要传递新值或消耗值
