Stackblitz示例：https://stackblitz.com/edit/ngif-detectionchange
我有testToggle组件，它可以由于绑定到其中的某些属性而改变其高度。它具有同级testParent组件，该组件可以弯曲以承担其余的高度，并且具有子testChild组件，该子组件具有绑定到testParent的高度。当testParent具有带真实表达式的* ngIf指令时，当testToggle更改绑定到其高度的属性时，我得到：
错误：ExpressionChangedAfterItHasBeenCheckedError：表达式具有 检查后更改。
记录组件的生命周期挂钩顺序后，我发现了一些奇怪的东西：
No ngIf used testParent has ngIf with expression true
testToggle: DoCheck testToggle: DoCheck
testParent: DoCheck testParent: DoCheck
testToggle: AfterContentChecked testParent: AfterContentChecked
testParent: AfterContentChecked testChild: DoCheck
testChild: DoCheck testChild: AfterContentChecked
testChild: AfterContentChecked testChild: AfterViewChecked
testChild: AfterViewChecked testParent: AfterViewChecked
testToggle: AfterViewChecked testToggle: AfterContentChecked
testParent: AfterViewChecked testToggle: AfterViewChecked
显然，正确的示例抛出ExpressionChanged，因为整个testParent周期已经结束，testToggle才可以更新其绑定（这会改变其高度，从而改变testParent的高度）。
我想知道为什么使用ngIf动态添加的组件在通过组件树正常继续运行之前要完成其整个生命周期？