详解Angular组件之生命周期(二)(2)

export class AppComponent implements OnInit, AfterViewInit, AfterContentInit,AfterContentChecked{ message:string='abc'; ngAfterViewInit(){ console.log("父组件的视图初始化完毕"); } ngAfterContentInit(){ console.log("父组件投影内容初始化完毕"); this.message='def'; } ngAfterContentChecked(){ console.log("父组件投影内容变更检测完毕"); } ngOnInit(){ }

三、总结

上面四个方法在属性初始化阶段：构造函数是初始化对象，ngOnChanges是初始化输入属性，ngOnInit是初始化除了输入属性以外其它的所有属性，ngDoCheck是做一次变更检查。

这四个方法执行完整个组件所有属性都被赋予了应该被赋的值。

组件开始渲染它的视图，首先渲染投影进来的内容，投影进来的内容渲染完调用ngAfterContentInit和ngAfterContentChecked钩子方法。

如果有子组件会调子组件创建的过程，子组件创建完或者没有子组件，整个组件的视图都初始化完毕了以后，会调ngAfterViewInit和ngAfterViewChecked钩子方法。

至此，整个组件初始化完毕，组件会呈现给用户交互。

用户交互触发Angular的变更检测机制，检测到发生了变更，在当前组件树上所有活动组件上被实现的带有check的钩子方法都会被调用，用来检查当前组件的变化，如果变化导致某个组件的输入属性也改变了，那个组件的ngOnChanges也会被调用。

组件在路由地址变化从而被销毁的时候会调ngOnDestory()。

在ngOnDestory中销毁一些引用的资源，比如反订阅一个流，清除定时器之类的。