本章接着说组件的生命周期~
ngAfterContentInit
组件内容初始化钩子函数,在组件使用<ng-content>将外部内容嵌入到组件视图后就会调用ngAfterContentInit,它在第一次ngDoCheck执行后调用,且只执行一次。
可以在该钩子函数中改变视图内容。例如:变量初始化
示例如下:

13-6.gif
ngAfterContentChecked
在组件使用了<ng-content>自定义内容的情况下,angular在这些外部内容嵌入到组件视图后或者每次变换监测的时候都会调用ngAfterContentChecked。
实际上,它也属于脏值检测,只不过是<ng-content>内容脏值检测完成后调用。同样也可以多次调用。

13-7.gif
ngAfterViewInit
组件的视图初始化,指的是组件及子组件和其内容全部初始化完成。初始化完组件视图及其子视图之后调用。

13-8.gif
ngAfterViewChecked
类似的,它是组件视图的脏值检测。组件视图的脏值检测同样是angular框架来完成的,也是多次调用的。
此时可以看一下,除了组件的销毁,组件的其它生命周期函数都已经列出来了。

13-9.png
除了ngOnChanges和脏值检测函数可多次调用,其它函数都是一次性调用的。脏值检测后期会细讲。
ngOnDestroy
组件销毁的时候调用这个钩子函数。在父组件中调用子组件时定义一个组件销毁条件,如果scrollabelTabBackgroundColor为红色那么显示,不是红色,那么将被销毁掉。示例如下:

13-10.gif
另外,ngOnDestroy是需要做一些清理工作的,如果你使用了等待事件,如setTime,setInterval或者setTimeout等,需要在ngOnDestroy中清理,否则会导致内存泄漏。