Question

我有一个Plunkr在这里演示问题：https://plnkr.co/edit/e5OVhuWtyStxI1vvXd9h

摘要是：

我有一个父子组件。孩子的变化检测策略设置为onPush。

Child的模板就是这样：

@Component({
  selector: 'child',
  template: `
  <button (click)="changeHello()">Change</button>
  {{hello}} 
`,
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ChildComponent {

  hello = "hi";

  ngOnChanges() {
    console.log("on changes called");
  }

  ngDoCheck() {
    console.log("do check called");
  }

  changeHello() {
    this.hello = "goodbye";
  }
}

为什么当我点击按钮时一切正常并且更改实际反映在视图中？（即从hi更改为goodbye）

我认为事件的顺序是：

用户点击按钮
“hello”类属性现在指向“goodbye”字符串
onTurnDone()区域事件被调用，Angular开始从根
当在根目录上时，它注意到没有任何子输入已更改，并且因为其更改检测策略设置为onPush，它会在那里停止并且不会在子项中运行更改检测 < / LI>
模板中的{{hello}}未更新为goodbye，仍显示旧的hi

我的上述推理在哪里出错了？为什么ngDoCheck()被调用？

当更改检测设置为onPush时，为什么组件视图会更新？

0 个答案: