angularJS directive中的controller和link function辨析
在angularJS中,你有一系列的view,负责将数据渲染给用户;你有一些controller,负责管理$scope(view model)并且暴露相关behavior(通过$scope定义)给到view;你有一些directive,负责将user interaction和$scope behavious link起来。但是还有一样东西: a directive controller.这个directive controller子一个directive的context中定义,但是它又可以被injected到其他的directives中作为一种便利化inter-directive communication的方法。
angularJS中directive应该是最重要最强大的了,在ddo中,有两个地方可以引入自定义的功能,一个是controller属性,一个是link属性,directive的这两个属性到底有什么区别呢?我们的代码到底应该放到directive的controller还是link属性中去呢?
问一下自己:我希望这段代码什么时间点去运行呢?对这个问题的回答决定了你应该讲代码放到哪里:
- 在compilation之前运行? - 放到controller属性中去
- 希望暴露一个API给其他directives? -放到controller属性中去定义API
- 在compilation之后运行? - 放到link属性中
angular在compile,link,controller被编译的时间顺序:

angular.module('compilation', [])
.directive('logCompile', function($rootScope) {
$rootScope.log = "";
return {
controller: function($scope, $attrs) {
$rootScope.log = $rootScope.log + ($attrs.logCompile + ' (controller)\n');
},
compile: function compile(element, attributes) {
$rootScope.log = $rootScope.log + (attributes.logCompile + ' (compile)\n');
return {
pre: function preLink(scope, element, attributes) {
$rootScope.log = $rootScope.log + (attributes.logCompile + ' (pre-link)\n');
},
post: function postLink(scope, element, attributes) {
element.prepend(attributes.logCompile);
$rootScope.log = $rootScope.log + (attributes.logCompile + ' (post-link)\n');
}
};
}
};
})
.directive('terminate', function() {
return {
terminal: true
};
});
http://jasonmore.net/angular-js-directives-difference-controller-link/
angularJS directive中的controller和link function辨析的更多相关文章
- 【转】angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
- angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
- angularjs指令中的compile与link函数详解(转)
http://www.jb51.net/article/58229.htm 通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link, ...
- angularjs指令中的compile与link函数详解补充
通常大家在使用ng中的指令的时候,用的链接函数最多的是link属性,下面这篇文章将告诉大家complie,pre-link,post-link的用法与区别. angularjs里的指令非常神奇,允许你 ...
- Angular1.0 在Directive中调用Controller的方法
Controller中定义了$scope.method = function(){} Directive中需要引入$scope http://stackoverflow.com/questions/2 ...
- angularjs directive中@ = &使用详解
这段时间在学习angularjs,对directive指令的绑定策略弄了好久才明白,现在做下笔记方便以后查阅,若有错误欢迎指出. 为了使新的指令作用域能访问当前的作用域的一些属性,通常会使用@.=.& ...
- AngularJS之指令中controller与link(十二)
前言 在指令中存在controller和link属性,对这二者心生有点疑问,于是找了资料学习下. 话题 首先我们来看看代码再来分析分析. 第一次尝试 页面: <custom-directive& ...
- 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 ...
- 学习AngularJs:Directive指令用法(完整版)
这篇文章主要学习AngularJs:Directive指令用法,内容很全面,感兴趣的小伙伴们可以参考一下 本教程使用AngularJs版本:1.5.3 AngularJs GitHub: http ...
随机推荐
- Linux and Shell 实用命令
-name '*.jar' -printf '%p:' ### 查看CPU使用率 mpstat -P ALL
- python统计喜欢的小说主角出场次数
这周老师布置了一项作业,让我们回去将自己喜欢的小说里面的主角出场次数统计出来,我对这个充满了兴趣,但我遇到了三个问题: (1)一开始选了一部超长的小说(最爱之一),但是运行时老是不行,老是显示下图错误 ...
- java se系列(十一)线程
1 线程的概述 进程:正在运行的程序,负责了这个程序的内存空间分配,代表了内存中的执行区域. 线程:就是在一个进程中负责一个执行路径. 多线程:就是在一个进程中多个执行路径同时执行. 图上的一键优化与 ...
- C# LINQ学习笔记
LINQ,语言集成查询: LINQ TO SQL,同EF,NHibernate一样,也是一种ORM框架: 1. 入门应用示例: static public void LinqBasic() { var ...
- J15W-J45W铜质截止阀厂家,J15W-J45W铜质截止阀价格 - 专题栏目 - 无极资讯网
无极资讯网 首页 最新资讯 最新图集 最新标签 搜索 J15W-J45W铜质截止阀 无极资讯网精心为您挑选了(J15W-J45W铜质截止阀)信息,其中包含了(J15W-J45W铜质截止阀)厂家,( ...
- Netstat 的 10 个基本用法
Netstat 简介 Netstat 是一款命令行工具,可用于列出系统上所有的网络套接字连接情况,包括 tcp, udp 以及 unix 套接字,另外它还能列出处于监听状态(即等待接入请求)的套接字. ...
- day2-模块初识之路径问题
sys需要调用my_test,但是不在同一目录 会出现如下错误 具体办法:1.将my_test.py放到文件夹下 附:sys.py 和my-test.py具体代码 enumerate 重点:浅复制(用 ...
- 点击劫持(click jacking)
什么是点击劫持劫持原理劫持案例代码示例优酷频道刷粉的POC腾讯微博刷粉防御 什么是点击劫持 点击劫持,clickjacking,也被称为UI-覆盖攻击.这个词首次出现在2008年,是由互联网安全专家罗 ...
- (转)expect命令脚本语言介绍及生产实践
原文:http://www.fblinux.com/?p=526 Expect介绍 expect是一个用来实现自动交互功能的软件套件,是用来实现自动和交互式任务程序进行通信,无需人的手工干预.比如SS ...
- SpagoBI系列----------[01]SpagoBI简介及安装步骤
商务智能套件SpagoBI提供一个基于J2EE的框架用于管理BI对象如报表.OLAP分析.仪表盘.记分卡以及数据挖掘模型等的开源BI产品.它提供的BI管理器能 够控制.校验.验证与分发这些BI对象. ...