第一阶段:加载阶段

angularJs要运行的话,需要去等待angular.js加载完成,加载完之后呢,angular就会去查找到ng-app这个指令,ng-app在每个应用里面只能出现一次,

它也就相当于我们的main方法,angularjs找到了ng-app之后,就确定了我们应用的边界在哪里。

所谓的边界,就是angularjs知道自己要管理哪一块的内容。

这样的话,angularjs才可以去启动起来,加载完成之后,就进入了第二阶段

第二阶段:编译阶段

这个阶段,angular.js会做很多的事情

第一步:首先它会去遍历dom,把整个dom结构中的所有的指令全部查找出来,然后缓存到内部的缓存里面去

第二步:会根据指令代码中的template,replace,transclue等对dom结构进行一些变换,

这时候,如果代码中存在compile函数,angluarjs也会去调用这个函数,如下是自定义的compile

不过一般我们在自定义指令的时候,是不会去自定义compile函数的,因为在调用自定义compile的时候,还要去调用内部默认的compile,否则默认的compile默认的行为就会被覆盖

第三阶段:链接阶段

链接阶段又会做些什么事情呢?

首先,每条指令的link指令都会被调用

我们在指令的编写指令代码的时候,除了可以写compile函数以外,还可以写link自定义函数,

angularjs在找到这个函数以后,angulajs也会去运行link函数,

我们知道,不要在controller或才其他地方操作dom,因为这个思想不符合angularjs的设计思想,

那么dom在哪些地方可以操作呢?我们可以在link中操作dom

那么这个link函数可以做些什么事情呢?

它可以为dom元素绑定一些事件,绑定作用域,比如双向数据绑定

指令和双向数据绑定,就是在link这个阶段运行的

以上就是angularjs指令执行的三个阶段。

以上内容了解即可。无需刻意去记忆。

angularJs指令执行的机制==大概的三个阶段的更多相关文章

  1. AngularJS 指令生命周期 complie link

    AnguarJS指令从解析到生效一共会经历Inject.Compile.Controller加载.Pre-link.Post-link这几个主要阶段. 一.AngularJS指令执行过程 1.加载An ...

  2. AngularJS指令的详解

    指令作为AngularJS中最为重要的部分,所以这个框架本身也是自带了比较多的的指令,但是在开发中,这些指令通常不能满足我们的需要,所以我们也是需要自定义一些指令的.指令是我们用来扩展浏览器能力的技术 ...

  3. angularjs指令(二)

    最近学习了下angularjs指令的相关知识,也参考了前人的一些文章,在此总结下. 欢迎批评指出错误的地方.   Angularjs指令定义的API AngularJs的指令定义大致如下 angula ...

  4. 【转】angularjs指令中的compile与link函数详解

    这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下   通常大家在 ...

  5. AngularJS指令进阶 – ngModelController详解

    AngularJS指令进阶 – ngModelController详解 在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流.举个简单的例子,假如我 ...

  6. angularJS 指令解释

    本文引自 http://blog.csdn.net/kongjiea/article/details/49840035 指令,很重要 AngularJS与jQuery最大的区别在哪里?我认为,表现在数 ...

  7. angularjs指令中的compile与link函数详解

    这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下   通常大家在 ...

  8. AngularJS 作用域与数据绑定机制

    AngularJS 简介 AngularJS 是由 Google 发起的一款开源的前端 MVC 脚本框架,既适合做普通 WEB 应用也可以做 SPA(单页面应用,所有的用户操作都在一个页面中完成).与 ...

  9. AngularJs指令(一)

    AngularJs应用现在越来越流行了,谷歌都与微软合作支持AngularJS2.0,这是要逆天了,说明AngularJs将来大势所趋.最近想跳槽,又重新拾起了AngluarJs(之前由于缺少项目应用 ...

随机推荐

  1. XIII Open Cup named after E.V. Pankratiev. GP of Asia and South Caucasus

    A. RPG 首先计算出每个技能对于每个属性值的可行区间,若区间为空则不合法. 枚举两个技能,以及每个属性值,根据区间的关系可以得到哪个必须要在另一个之前学,连边看看是否有环即可. 时间复杂度$O(n ...

  2. BZOJ3421 : Poi2013 Walk

    最多只有一个连通块大小大于$nk$,所以用hash表进行BFS的时候只扩展$nk$步即可. 时间复杂度$O(n^2k)$. #include<cstdio> typedef long lo ...

  3. windows自动修改ip的bat文件

    @echo off title --IP自动设置 -- MODE con: COLS=80 lines=30 color 0a :main cls echo 按提示操作 echo. echo 设置为无 ...

  4. UVa 10870 & 矩阵快速幂

    题意: 求一个递推式(不好怎么概括..)的函数的值. 即 f(n)=a1f(n-1)+a2f(n-2)+...+adf(n-d); SOL: 根据矩阵乘法的定义我们可以很容易地构造出矩阵,每次乘法即可 ...

  5. Android HttpURLConnection Post 参数 (https)

    声明utf-8: public static String CHARSET_UTF8 = HTTP.UTF_8; eg:登陆请求方法,通过接口返回结果: public static void logi ...

  6. 洛谷 P1462 通往奥格瑞玛的道路 Label: 最小化最大值 && spfa (存多条边示例)

    题目背景 在艾泽拉斯大陆上有一位名叫歪嘴哦的神奇术士,他是部落的中坚力量 有一天他醒来后发现自己居然到了联盟的主城暴风城 在被众多联盟的士兵攻击后,他决定逃回自己的家乡奥格瑞玛 题目描述 在艾泽拉斯, ...

  7. js,html,css注释大集合

    1.js注释: 单行注释,在注释内容前加符号 “//” <script type="text/javascript"> document.write("单行注 ...

  8. BZOJ3343: 教主的魔法 分块

    2016-05-28  10:27:19 题目:http://www.lydsy.com/JudgeOnline/problem.php?id=3343 比较显然的分块题,分块后块内排序,维护整块的附 ...

  9. storyboard自动布局时,代码修改 constraint 的值,没有反应

    从 width equalto 其他控件的 width   到  当前控件固定的 width, 再到不固定当前控件的 width, 只固定当前控件的 trailing 是一个不错的思想.

  10. HTTPS原理介绍

    内容来源于:http://www.guokr.com/post/114121/ 自己做个备忘. 二.HTTPS到底安全吗? 这个答案是肯定的,很安全.谷歌公司已经行动起来要大力推广HTTPS的使用,在 ...