测试案例

.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. openstack instance snapshort

    从下面的截图 高手应该能够看到openstack基于snapshort的 实例的 备份策略了!!!! 从下面某张截图你也能看到用openstack snapshort备份 也是 不太理想的,首先从“磁 ...

  2. 在RHEL5.4 设置KVM(虚拟机)通过桥接器上网

    以root身份登录系统,创建桥接器配置文件 #cd /etc/sysconfig/network-scripts/ #cp ifcfg-eth0 ifcfg-br0 #vi ifcfg-br0 桥接器 ...

  3. B+树|MYSQL索引使用原则

    MySQL一直了解得都不多,之前写sql准备提交生产环境之前的时候,老员工帮我检查了下sql,让修改了一下存储引擎,当时我使用的是Myisam,后面改成InnoDB了.为什么要改成这样,之前都没有听过 ...

  4. coco2d-x 纹理研究

    转自:http://blog.csdn.net/qq51931373/article/details/9119161 1.通常情况下用PVR格式的文件来进行图片显示的时候,在运行速度和内存消耗方面都要 ...

  5. HDU 1455 http://acm.hdu.edu.cn/showproblem.php?pid=1455

    #include<stdio.h> #include<stdlib.h> #include<math.h> #include<string.h> #de ...

  6. hibernate注解@JoinTable说明

    表关联(@JoinTable)注解说明:@Target({METHOD, FIELD})public @interface JoinTable{    String name() default &q ...

  7. [iOS基础控件 - 6.9.4] 抓取网页图片资源

    A.需求 1.利用浏览器取得网页的源码 2.解析源码,获取图片地址(这里使用了java的一个库来解析html) 3.获取资源,生成plist目录   B.实现步骤 1.打开一个网页,最好里面是包含了静 ...

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

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

  9. Activator.CreateInstance 方法 (Type) 的用法

    转自:http://www.cnblogs.com/lmfeng/archive/2012/01/30/2331666.html Activator.CreateInstance 方法 (Type) ...

  10. 用Spring3编写第一个HelloWorld项目

    第一个HelloWorld程序 让我们用Spring来写第一个应用程序吧. 完成这一章要求: 熟悉Java语言 设置好Spring的环境 熟悉简单的Eclipse IDE的操作 如果你还没有设置好环境 ...