angular4启动过程中组件生命周期的运行顺序（包含脏值检测的过程）

背景

年前对实验室研一的同学做了一个angular专题学习的培训，培训的效果不太理想，想了想原因还是对angular中的原理不理解所致。以后再做angular项目的时候多了解一下其中的原理。本次学习angular的启动过程。

Angular启动过程中生命周期钩子的运行顺序

运行顺序如图所示：

生命周期执行顺序：
1、ngOnChanges（因本组件无输入属性 ，所以该方法没有执行）
在有输入属性的情况下才会调用，该方法接受当前和上一属性值的SimpleChanges对象。如果有输入属性，会在ngOnInit之前调用。
2、ngOnInit
在组件初始化的时候调用，只调用一次，在第一次调用ngOnChanges之后调用。
3、ngDoCheck
在组件定义的属性或方法变更时调用(用于脏值之检测，非常耗性能，因为会把所有的属性和方法都检测一遍），会在ngOnChanges()和ngOnInit()之后
4、ngAfterContentInit
在组件内容初始化之后调用，在第一次ngDoCheck之后调用，只调用一次
5、ngAfterContentChecked
在组件每次检查内容放生变更时调用。在ngAfterContentInit和每次ngDoCheck之后调用

上图中执行完ngAfterContentChecked、开始执行组件中与模板绑定的方法，此时为getvalue()和getReturn()。、

6、ngAfterViewInit
在组件相应的视图初始化之后调用，第一次ngAfterContentChecked之后调用，只调用一次
7、ngAfterViewChecked
在组件每次检查视图发生变更时调用。ngAfterViewInit和每次ngAfterContentChecked之后调用。

上图中执行完ngAfterViewChecked、开始执行模板中绑定的方法，此时为getvalue()和getReturn()。

然后进行脏值检测，调用ngDoCheck方法，因ngAfterContentInit和ngAfterViewInit都是刚启动时之调用一次，所以后面开始调用ngAfterContentChecked（）和ngAfterViewChecked（），进行相应视图和组件的值同步

ngAfterContentChecked（）个人理解：做完组件的变更检测时调用；为组件中属性值改变的话同步到模板。
和ngAfterViewChecked（）个人理解：做完模板的变更检测时调用；模板中输入值改变的话同步到组件。

8、ngOnDestroy
在组件销毁前调用，做一些清理工作，比如退订可观察对象和移除事件处理器，以免导致内存泄漏。