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 ...
随机推荐
- git特殊用法
git stash的使用 1.当前分支写了一半的代码,需要切到其他分支修复bug或者完成优先级较高的任务时 git stash 暂存分支进度 git stash list 查看草稿区 git stas ...
- QueryRunner(DBUtils) 结果集实例
转自:http://www.cnblogs.com/myit/p/4272824.html# 单行数据处理:ScalarHandler ArrayHandler MapHandler ...
- 【C语言】-返回指针的函数与指向函数的指针
本文目录 前言 一.返回指针的函数 二.指向函数的指针 说明:这个C语言专题,是学习iOS开发的前奏.也为了让有面向对象语言开发经验的程序员,能够快速上手C语言.如果你还没有编程经验,或者对C语言.i ...
- Python获取当前路径下的配置文件
Python获取当前路径下的配置文件 有的时候想读取当前目录下的一个配置文件.其采用的办法是: import os # 获取当前路径 curr_dir = os.path.dirname(os.pat ...
- <数据挖掘导论>读书笔记4--其他分类技术
1.基于规则的分类器 2.最近邻分类器 3.贝叶斯分类器 4.人工神经网络 5.支持向量机 6.组合方法 7.不平衡类问题 8.多类问题
- linux新建用户切换后显示-bash-4.1$(转载)
今天新建了一个MQM的用户 , [plain] view plaincopy useradd -g mqm -d /var/mqm passwd mqm 终端中显示 -bash-4.1$而不是 [mq ...
- [springBoot系列]--spring-boot-devtools在Idea中热部署方法
1 pom.xml文件 注:热部署功能spring-boot-1.3开始有的 <!--添加依赖--> <dependency> <groupId>org.sprin ...
- bootstrap-select在angular上的应用
1.bootstrap-select 依赖bootstrap.js ,又依赖jQuery,这些都可以用requirejs来处理. 2.一般bootstrap-select 都放在具体的模块上,而是动态 ...
- log4j.properties 基本配置
log4j.rootLogger=WARN,stdout,D log4j.appender.stdout=org.apache.log4j.ConsoleAppender log4j.appender ...
- easyui焦点离开事件的解决方案