ngOnInit（），ngAfterViewInit（），ngafterContentInit（），ngAfterViewChecked（）和构造函数（）之间有什么区别？

Question

ngOnInit （）， ngAfterViewInit （）， ngafterContentInit （）， ngAfterViewChecked 之间有什么区别（ ）和构造函数（）？我们如何在Angular 2中实现它们？ 他们的目的和用途是什么？哪一方面对它们有用呢？

感谢。

Answer 1

这些生命周期挂钩可以用来执行操作和组件生命周期的不同时间。

官方角度文档中有关于该主题的优秀指南：https://angular.io/guide/lifecycle-hooks

  

组件具有由Angular管理的生命周期。

     

Angular创建它，渲染它，创建并渲染它的子节点，   在数据绑定属性发生变化时检查它，然后销毁它   在将其从DOM中删除之前。

     

Angular提供了生命周期钩子，可以提供对这些键的可见性   生命时刻和发生时的行动能力。

official documentation中的下图描述了生命周期挂钩的顺序：

Answer 2

  

构造

这是Angular实例化组件时触发的类构造函数。它主要用于DI，在Angular运行变化检测之前调用。你可以在这里阅读更多相关信息：

• The essential difference between Constructor and ngOnInit in Angular

  

ngOnInit（），ngAfterViewInit（），ngafterContentInit（），   ngAfterViewChecked（）

这些是生命周期钩子。它们的调用时间不同，因此每个数据中都有可用的数据。有关变更检测中其他操作的时间安排在文章中清楚地显示：

Everything you need to know about change detection in Angular

订单明确定义：

如果绑定发生更改，
1. OnChanges子组件上的生命周期挂钩

@Input绑定发生变化时通知。如果您需要经常来跟踪这些绑定，请使用它。

子项组件上的
1. OnInit和ngDoCheck（仅在首次检查时调用OnInit）

通知@Input绑定可用。如果您不需要经常跟踪这些绑定，请使用它。

子组件实例上的
1. AfterContentInit和AfterContentChecked生命周期挂钩（AfterContentInit仅在首次检查时调用）

通知Angular对预计内容（ng-content）进行了更改检测。如果您需要使用@ContentChildren装饰器查询投影元素，请使用它。

子组件实例上的
1. AfterViewInit和AfterViewChecked生命周期挂钩（AfterViewInit仅在首次检查时调用）

通知Angular对视图内容进行了更改检测。如果您需要使用@ViewChildren装饰器查询视图元素，请使用它。

关于ngDoCheck生命周期钩子存在很多混淆。要了解更多内容，请阅读If you think ngDoCheck means your component is being checked — read this article。