Angular8 实战(十四)组件生命周期(2)

本章接着说组件的生命周期~

ngAfterContentInit

组件内容初始化钩子函数,在组件使用将外部内容嵌入到组件视图后就会调用ngAfterContentInit,它在第一次ngDoCheck执行后调用,且只执行一次。
可以在该钩子函数中改变视图内容。例如:变量初始化
示例如下:

13-6.gif

ngAfterContentChecked

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

13-7.gif

ngAfterViewInit

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


13-8.gif

ngAfterViewChecked

类似的,它是组件视图的脏值检测。组件视图的脏值检测同样是angular框架来完成的,也是多次调用的。

此时可以看一下,除了组件的销毁,组件的其它生命周期函数都已经列出来了。


13-9.png

除了ngOnChanges和脏值检测函数可多次调用,其它函数都是一次性调用的。脏值检测后期会细讲。

ngOnDestroy

组件销毁的时候调用这个钩子函数。在父组件中调用子组件时定义一个组件销毁条件,如果scrollabelTabBackgroundColor为红色那么显示,不是红色,那么将被销毁掉。示例如下:


13-10.gif

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

你可能感兴趣的:(Angular8 实战(十四)组件生命周期(2))