概述

angular的组件及指令都有相应的声明周期: 创建, 更新, 销毁, 我们可以通过实现相应的生命周期钩子接口来进入相应的该声明周期的关键时刻

组件生命周期顺序

    • ngOnChanges: 当组件数据绑定的输入属性发生变化时触发, 该方法接受一个SimpleChanges对象,包括当前值和上一属性值.首次调用一定发生在ngOnInit前,注意的是该方法仅限于对象的引用发生变化时,也就是说,如果对象的某个属性发生变化,Angular是不会触发onChanges的.
    • ngOninit:初始化指令或组件, 在angular第一次展示组件的绑定属性后调用,该方法只调用一次.
    • ngDocheck: 检测,并在发生Angular无法或不愿意自己检测的变化时作出反应。
      在每个Angular变更检测周期中调用,ngOnChanges()ngOnInit()之后。

      • ngAfterContentInit: 当把内容投影进组件之后调用。
        第一次ngDoCheck()之后调用,只调用一次. 只适用于组件。
      • ngAfterContentChecked: 每次完成被投影组件内容的变更检测之后调用。
        ngAfterContentInit()和每次ngDoCheck()之后调用,只适合组件。
      • ngAfterViewInit: 在angular初始化组件及其子组件的视图之后调用, 只调用一次,第一次
        ngAfterContentChecked()之后调用.只适合组件。
      • ngAfterViewChecked: 每次做完组件视图和子视图的变更检测之后调用。
        ngAfterViewInit()和每次ngAfterContentChecked()之后调用。只适合组件。
    • ngOnDestory: 在angular每次销毁组件或指令之前调用, 通常用于移除事件监听,退订可观察对象等.                    原文直通车

angular生命周期的更多相关文章

  1. angular 生命周期钩子 ngOnInit() 和 ngAfterViewInit() 的区别

    angular 生命周期钩子的详细介绍在 https://angular.cn/guide/lifecycle-hooks  文档中做了介绍. ngOnInit() 在 Angular 第一次显示数据 ...

  2. angularjs link compile与controller的区别详解,了解angular生命周期

     壹 ❀ 引 我在 angularjs 一篇文章看懂自定义指令directive 一文中简单提及了自定义指令中的link链接函数与compile编译函数,并说到两者具有互斥特性,即同时存在link与c ...

  3. Angular生命周期理解

    Angular每个组件,包含根组件和每一级的子组件,都存在一个生命周期,从创建,变更到销毁.Angular提供组件生命周期钩子,把这些关键时刻暴露出来,赋予在这些关键结点和组件进行交互的能力. 在An ...

  4. angular、angular2、vue的生命周期

    angular生命周期是什么 1.Angular每个组件都存在一个生命周期,从创建,变更到销毁.Angular提供组件生命周期钩子,把这些关键时刻暴露出来,赋予在这些关键结点和组件进行交互的能力,掌握 ...

  5. Angular2 组件生命周期

    1. 说明 Angular每个组件都存在一个生命周期,从创建,变更到销毁.Angular提供组件生命周期钩子,把这些关键时刻暴露出来,赋予在这些关键结点和组件进行交互的能力. 2. 接口 按照生命周期 ...

  6. Angular 个人深究(四)【生命周期钩子】

    Angular 个人深究(四)[生命周期钩子] 定义: 每个组件都有一个被 Angular 管理的生命周期. Angular 创建它,渲染它,创建并渲染它的子组件,在它被绑定的属性发生变化时检查它,并 ...

  7. angular的生命周期

    什么是生命周期 生命周期函数通俗的讲就是组件创建.组件更新.组件销毁的时候会触发的一系列的方法. 当 Angular 使用构造函数新建一个组件或指令后,就会按下面的顺序在特定时刻调用这些 生命周期钩子 ...

  8. Angular 5.x 学习笔记(2) - 生命周期钩子 - 暂时搁浅

    Angular 5.x Lifecycle Hooks Learn Note Angular 5.x 生命周期钩子学习笔记 标签(空格分隔): Angular Note on cnblogs.com ...

  9. Angular组件生命周期——生命周期钩子

    生命周期钩子介绍: 1.ngOnChange:响应组件输入值发生变化时触发的事件. 2.ngOnInit:用于数据绑定输入属性之后初始化组件,在第一次ngOnChange之后被调用. a. 组件构造后 ...

随机推荐

  1. 查看linux服务器的配置

    https://zhidao.baidu.com/question/489376921.html 1.查看逻辑CPU个数: #cat /proc/cpuinfo |grep "process ...

  2. mysql数据表的字段操作

    CREATE TABLE `users` ( `id` int(11) NOT NULL AUTO_INCREMENT, `username` varchar(255) DEFAULT NULL, ` ...

  3. PAT A1113 Integer Set Partition (25 分)——排序题

    Given a set of N (>1) positive integers, you are supposed to partition them into two disjoint set ...

  4. Ubuntu 上安装QTAV第三方视频库

    安装QtAV的基本环境: sudo apt-get install build-essential sudo apt-get install libgl1-mesa-dev sudo apt-get ...

  5. jdk_1_8_1

    JAVA_HOME=/usr/local/java/jdk1.8.0_181 PATH=$JAVA_HOME/bin:$PATH JAVA_BINDIR=/usr/local/java/jdk1.8. ...

  6. 授人以鱼不如授人以渔——和女儿学一起学成语

    女儿二年级了,前段时间背了<小学生必背古诗词75首>,采用几天一篇,然后滚动复习这种方式.磕磕绊绊也把一本古诗背了一遍,效果吗?是有的,但是不怎么明显,前面背,后面忘.当然这是规律,难免的 ...

  7. SkylineGlobe 如何实现绘制圆形Polygon和对图层的圆形范围选择查询

    //结束绘制圆形之前,得到Polygon var pos = gPolyObj.Position; var bufferR = gPolyObj.Radius; var cVerticesArray ...

  8. 9-51单片机ESP8266学习-AT指令(单片机采集温湿度数据通过8266发送给AndroidTCP客户端显示)

    http://www.cnblogs.com/yangfengwu/p/8798512.html 补充:今天答应了一个朋友写一下如果单片机发过的是字符串应该怎么解析,答应了今天写,哦哦哦是明天了,闲话 ...

  9. XML转换为对象/Javabean

    將XML轉換為對象 /** * xml转换成JavaBean * @param xml * @param c * @return */ public static <T> T conver ...

  10. WPF CheckBox 滑块 样式 开关

    原文:WPF CheckBox 滑块 样式 开关 效果图 样式代码 <Style x:Key="CheckRadioFocusVisual"> <Setter P ...