测试案例

.directive('testDirective', function() {
return {
restrict: 'E',
template: '<p>Hello {{number}}!</p>',
controller: function($scope, $element){
$scope.number = "controller:"+$scope.number;
},
link: function(scope, el, attr) {
scope.number = "link:"+scope.number;
},
compile: function(element, attributes) {
return {
pre: function preLink(scope, element, attributes) {
scope.number = "compile: pre:"+scope.number;
},
post: function postLink(scope, element, attributes) {
scope.number = "compile: post:"+scope.number;
}
};
}
}
});

controller先运行,compile后运行,link不运行

将上例中的compile注释掉,controller先运行,link后运行,link和compile不兼容

controller,link,compile不同的更多相关文章

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

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

  2. 了解 : angular controller link ng-init 顺序

    controller 会先跑,接着是view 里的ng-init,最后是link (指令里的). 所有在指令里如果用link去拿$attr,会有拿不到ng-init想setup的值

  3. directive 指令一

    什么是Directive Directive将一段html,js封装在一起,形成一个可以复用的独立个体,具有特定的功能.angularjs中的指令通常是比较小的组件,它相当于是给我们提供了一些公共的自 ...

  4. angularJS directive中的controller和link function辨析

    在angularJS中,你有一系列的view,负责将数据渲染给用户:你有一些controller,负责管理$scope(view model)并且暴露相关behavior(通过$scope定义)给到v ...

  5. Directive Controller And Link Timing In AngularJS

    I've talked about the timing of directives in AngularJS a few times before. But, it's a rather compl ...

  6. Vue源码详细解析:transclude,compile,link,依赖,批处理...一网打尽,全解析!

    用了Vue很久了,最近决定系统性的看看Vue的源码,相信看源码的同学不在少数,但是看的时候却发现挺有难度,Vue虽然足够精简,但是怎么说现在也有10k行的代码量了,深入进去逐行查看的时候感觉内容庞杂并 ...

  7. $compile

    <html ng-app="compile"> <head> <script src="http://apps.bdimg.com/libs ...

  8. controller 和 指令 通讯方法

    在 angular 中我们经常会使用多个 controller 和 指令 他们拥有各自的 $scope , 这就产生了跨$scope调用的问题. 有几种常见的方法来可以使用. 方法一 : 指令 req ...

  9. angular $compile的使用

    在写前端js时,经常会动态创建标签放入文本元素中: 比如:var strDiv='<div>new create element</div>'; $(strDiv).appen ...

  10. 指令<AngularJs>

    对于指令,可以把它简单的理解成在特定DOM元素上运行的函数,指令可以扩展这个元素的功能. 首先来看个完整的参数示例再来详细的介绍各个参数的作用及用法: angular.module('myApp', ...

随机推荐

  1. 第二百四十九天 how can I 坚持

    竟然让我跟着他们去旅游..泡温泉,滑雪..西北坡,不去白不去. 罗娜,你别把我拉黑啊.哎,不知道咋办. 晚上玩了四局LOL,全输了,伤心. 还有今天抢票没抢到. 该怎么破,12点半正好在吃饭啊. 睡觉 ...

  2. C++问题-Qt Visual Studio Add-in

    问题现象:用VS打开其他人的项目提示如下:Qt Visual Studio Add-in...中间全TMD的英文,我就省略...QT版本不对,需要修改QT版本. 问题原因:占时不明,因为我是开发Del ...

  3. Xshell异常断开

    这可能是由于 SSH 超时断开连接 导致的!可以这样做...修改/etc/ssh/sshd_config文件,找到 ClientAliveInterval 0和ClientAliveCountMax ...

  4. JSF 2 dropdown box example

    In JSF, <h:selectOneMenu /> tag is used to render a dropdown box – HTML select element with &q ...

  5. WS103C8例程——串口2【worldsing笔记】

    在超MINI核心板 stm32F103C8最小系统板上调试Usart2功能:用Jlink 6Pin接口连接WStm32f103c8的Uart2,PC机向mcu发送数据,mcu收到数据后数据加1,回传给 ...

  6. jquery validation ajax 验证

    <link href="${base}/res/basic/css/jquery/validationEngine/validationEngine.jquery.css" ...

  7. 用Rufus来制作Windows10的U盘安装盘

    博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:用Rufus来制作Windows10的U盘安装盘.

  8. CKEditor与CKFinder整合并实现文件上传功能

    事先说明:此整合的是java版本的, 用到的有:jsp + ckeditor + ckfinder (没有servlet 及其它框架技术) 一.需要的资源: 用到的网站,文件自己下载: a) cked ...

  9. CESAsia:英特尔RealSense3D实感技术亮眼

    每年CES展会上都会有许多新奇的.更具创意的产品和创新技术亮相,而作为全球科技盛会之一的CES Asia也不例外.在CES Asia2016展会上,英特尔(Intel)可谓是有备而来,带着旗下支持Re ...

  10. 【转】部署web项目到weblogic上启动错误

    启动weblogic报错:java.lang.ClassCastException: com.sun.faces.application.WebappLifecycleListener cannot ...