1 
export class AppComponent implements OnInit, OnChanges {
  @Input()
  value: number;

  constructor(
    private cdr: ChangeDetectorRef
  ) {}

  ngOnInit() {
    of(1).subscribe(v => {
        this.value = v;

        console.log(1);

        this.cdr.detectChanges();

        of(2).subscribe(() => {
          console.log(2);
        });
      })
  }

  ngOnChanges(c: SimpleChanges) {
    console.log(3);
  }
}

我预计 console.log 的序列应该是1, 3, 2，但它只打印1, 2.

我知道只有当只有更改来自模板绑定ngOnChanges时才会触发。input

所以我this.cdr.detectChanges()马上打电话，console.log(1)但它没有用。

这里有什么问题？

我在这里制作了 stackblitz 示例 - https://stackblitz.com/edit/angular-ivy-ugdba1

额外问题

如果无法触发ngOnChanges组件内部，会触发哪些生命周期钩子this.cdr.detectChanges()？

4

2 回答 2

7

ngOnChanges当从父组件更改输入参数时调用。

如果您想在任何检测后做某事，您应该使用ngAfterViewChecked()

于 2020-07-29T14:02:42.337 回答
1

this.cdr.detectChages()在当前组件模板上调用变更检测。这意味着如果当前组件包含<child [data]="someData"></child>，则将检查其[data]输入是否有更改。child.ngDoCheck()将被调用，如果someData是新值child.ngOnChanges(...)将被调用。

于 2020-07-29T14:06:55.240 回答