当输入没有改变时，Angular 2 ChangeDetectionStrategy.OnPush 触发 ngAfterViewChecked

Question

我正在使用 OnPush 策略，根据 article 如果没有输入更改，则无需检查组件的模板。 但是在我的示例中，当我单击触发按钮并且在这种情况下输入没有改变时，ngAfterViewChecked 挂钩仍在运行。我错过了什么？

import {Component, NgModule, Input, ChangeDetectionStrategy} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'

@Component({
  selector: 'cmp',
  template: `
    <h1>{{data.name}}</h1>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class Cmp {
  @Input() data;

  ngOnChanges() {
    console.log('ngOnChanges');
  }

  ngAfterViewChecked() {
    console.log('view checked');
  }
}

@Component({
  selector: 'my-app',
  template: `
    <div>
      <cmp [data]="data"></cmp>
      <button (click)="trigger()">trigger</button>
      <button (click)="change()">Change</button>
    </div>
  `,
})
export class App {
  constructor() {
    this.data = {
      name: 'Angular'
    }
  }

  trigger() {

  }

  change() {
    this.data = {
      name: 'Angular2'
    };
  }
}

@NgModule({
  imports: [ BrowserModule ],
  declarations: [ App, Cmp ],
  bootstrap: [ App ]
})
export class AppModule {}

Answer 1

你没有错过任何东西。您对ngAfterViewChecked 的期望是正确的，当父changeDetectionStrategy 是OnPush 时，它不会调用子树组件。

目前有一个issue opened on Github，似乎触发生命周期回调不是唯一的问题，因为实际上进行了一些检查。