Angular ngIf指令如何改变检测变化周期？

Stackblitz示例：

我有一个

testToggle

组件，由于绑定到其中的某个属性，该组件可以更改其高度。它有兄弟

testParent

组件，该组件可以灵活地承受剩余的高度，它有子

testChild

组件，该组件绑定到

testParent

高度。当

testParent

具有带true表达式的*ngIf指令时，当

testToggle

将属性绑定到其高度时，我得到：

错误：ExpressionChangedTerrithasBeenCheckedError:表达式已更改 检查后更改

记录组件的生命周期钩子顺序后，我发现了一些奇怪的事情：

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

显然，右示例throw expression发生了变化，因为整个

testParent

周期在

testToggle

可以更新其绑定之前就已经结束了（这将改变其高度，从而改变

testParent

高度）

我想知道为什么使用ngIf动态添加的组件在通过组件树正常运行之前完成了整个生命周期