angular - ngAfterViewInit() 和 ngAfterViewChecked() 有什么区别？

Question

我正在学习Angular 2。在angular 2生命周期钩子(Hook)中

ngAfterContentInit -- Component content has been initialized
ngAfterContentChecked -- Component content has been Checked
ngAfterViewInit -- Component views are initialized
ngAfterViewChecked -- Component views have been checked

我无法理解 ngAfterContentInit 与 ngAfterContentChecked、ngAfterViewInit 与 ngAfterViewChecked 之间的区别。

他们提到组件内容已被检查和组件 View 已被检查。我不明白“检查”这个词指的是什么？

谁能解释一下。

Answer 1

详细解释生命周期 Hook 的最佳文章是 Everything you need to know about change detection in Angular .

ngAfterViewInit Vs ngAfterVIewChecked

如文章中所述，每次 Angular 完成对组件及其子组件的更改检测时，都会调用 ngAfterVIewChecked。 ngAfterViewInit 仅在第一个更改检测周期中被调用。如果您需要知道第一个变更检测周期何时运行，您可以使用它。例如，您需要为某些 jQuery 元素设置监听器，并且需要等待它们初始化:

ngAfterViewInit() {
  this.widget = $(this.location.nativeElement).slider({value: this.value});

  this.widget.on('slidestop', (event, ui) => {
    this.onChange(ui.value);
  });
}

这同样适用于 ngAfterContentInit，不同之处在于 Angular 对投影内容(通过 ng-content)而不是组件模板中指定的子项运行变化检测。

I can't understand what that word "Checked" mentioned?

检查意味着运行变更检测并执行与变更检测相关的操作，如 DOM 更新、查询列表更新和子组件绑定(bind)更新。