生命周期执行顺序
ngOnChanges

在有输入属性的情况下才会调用,该方法接受当前和上一属性值的SimpleChanges对象。如果有输入属性,会在ngOnInit之前调用。

ngOnInit

在组件初始化的时候调用,只调用一次,在第一次调用ngOnChanges之后调用

ngDoCheck

在组件定义的属性或方法变更时调用(用于脏值之检测,非常耗性能,因为会把所有的属性和方法都检测一遍),会在ngOnChanges()和ngOnInit()之后

ngAfterContentInit

在组件内容初始化之后调用,在第一次ngDoCheck之后调用,只调用一次

ngAfterContentChecked
在组件每次检查内容放生变更时调用。在ngAfterContentInit和每次ngDoCheck之后调用

 ngAfterViewInit

在组件相应的视图初始化之后调用,第一次ngAfterContentChecked之后调用,只调用一次

ngAfterViewChecked

在组件每次检查视图发生变更时调用。ngAfterViewInit和每次ngAfterContentChecked之后调用。

ngOnDestroy

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

angular5 生命周期钩子函数的更多相关文章

  1. vue之生命周期钩子函数之运用

    一.什么是生命周期钩子函数: 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运行 ...

  2. 关于 vue 生命周期 钩子函数 事件

    vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载Dom.渲染->更新->渲染.卸载等一系列过程,我们称这是vue的生命周期. 通俗的将就是vue实例从创建到销毁 ...

  3. Vue生命周期 钩子函数和组件传值

    Vue生命周期 钩子函数 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等. 同时在这个过程中也会运行一 ...

  4. 对vue生命周期/钩子函数的理解

    对于实现页面逻辑交互等效果,我们必须知晓vue的生命周期,才能愉快的玩耍,知道我们写的东西应该挂载到哪里,vue官方给出的api讲解的那叫一个简单啊,如下: 所有的生命周期钩子自动绑定this上下文到 ...

  5. vue生命周期 钩子函数

    首先,1.x和2.x的生命周期钩子对比: 钩子函数的树状图,红色的是我们可以利用的函数,绿色的是函数解析,蓝色的是函数执行时机 <!DOCTYPE html> <html> & ...

  6. Vue 2.0 生命周期-钩子函数理解

    Vue 2.0 + 生命周期钩子在项目过程中经常用到,所以闲下来整理了下,直接复制下面的实例运行: <!DOCTYPE html> <html lang="en" ...

  7. 了解angularjs中的生命周期钩子函数$onInit,$onChange,$onDestory,$postLink

     壹 ❀ 引 我在前面花了三篇文章用于介绍angularjs的指令directive,组件component,并专门花了一篇文章介绍directive与component的不同,其中提到在compon ...

  8. 什么是vue生命周期和生命周期钩子函数?

    原文地址 vue生命周期简介 咱们从上图可以很明显的看出现在vue2.0都包括了哪些生命周期的函数了. 生命周期探究 对于执行顺序和什么时候执行,看上面两个图基本有个了解了.下面我们将结合代码去看看钩 ...

  9. VueAPI 2 (生命周期钩子函数)

    所有的生命周期钩子自动绑定 this 上下文到实例中,因此你可以访问数据,对属性和方法进行运算.这意味着你不能使用箭头函数来定义一个生命周期方法. beforeCreate 在实例初始化之后,此时还不 ...

随机推荐

  1. Amaze UI JS 气泡弹出

    http://amazeui.org/javascript/popover?_ver=2.x

  2. yii2增删改查及AR的理解

    yii2增删改查 // 返回 id 为 1 的客户 $customer = Customer::findOne(1); // 返回 id 为 1 且状态为 *active* 的客户 $customer ...

  3. zw版【转发·台湾nvp系列Delphi例程】HALCON TestRegionPoint2

    zw版[转发·台湾nvp系列Delphi例程]HALCON TestRegionPoint2 procedure TForm1.Button1Click(Sender: TObject);var op ...

  4. M2C的概念

    M2C即Manufacturers to Consumer(生产厂家对消费者),生产厂家(Manufacturers)直接对消费者(Consumers)提供自己生产的产品或服务的一种商业模式,特点是流 ...

  5. linux常用命令:Linux 文件属性详解

    Linux 文件或目录的属性主要包括:文件或目录的节点.种类.权限模式.链接数量.所归属的用户和用户组.最近访问或修改的时间等内容.具体情况如下: 命令:  ls -lih 输出: [root@loc ...

  6. 计算概论(A)/基础编程练习1(8题)/4:求一元二次方程的根

    #include<stdio.h> #include<math.h> int main() { // 待解方程数目 int n; scanf("%d", & ...

  7. 使用 Vue.js 结合bootstrap 实现的分页控件

    原文链接:http://blog.csdn.net/qiuhaotc/article/details/53031884 源码下载: http://pan.baidu.com/s/1i4XgH6H 密码 ...

  8. 20162311 编写Android程序测试查找排序算法

    20162311 编写Android程序测试查找排序算法 一.设置图形界面 因为是测试查找和排序算法,所以先要有一个目标数组.为了得到一个目标数组,我设置一个EditText和一个Button来添加数 ...

  9. poj Meteor Shower - 搜索

    Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 16313   Accepted: 4291 Description Bess ...

  10. Linux必备知识

    一.Linux命令行常用快捷键 在企业工作中,管理Linux时—般不会直接采用键盘.显示器登录系统,而是会通过网络在远程进行管理,因此,需要通过远程连接具连接到Linux系统中.目前最常用的Linux ...