.directive('mydir',function(){
return{
multiElement: true/false,
priority: number, //default: 0
terminal: true/false,
scope: false/true/{
myattr: '=attr',
myattr2: '@str',
myattr3: '&fun'
},
bindToController: true/false,
controller: function($scope,$element,$attrs,$transclude){
$transclude([scope], cloneLinkingFn, futureParentElement)
/*$transclude(function(clone, scope) {
element.append(clone);
transcludedContent = clone;
transclusionScope = scope;
});*/
},
//default: /'?dirName'/
require: 'dirName'/'?dirName'/'^dirName'/'^^dirName'/'?^dirName'/'?^^dirName',
controllerAs: 'string',
restrict: 'ACEM', //default: 'AE'
templateNamespace: 'html'/'svg'/'math',
template: 'string'/function(tElement,tAttrs){
return 'string';
},
templateUrl: 'string'/function(tElement,tAttrs){
return 'string';
},
replace: '已被弃用',
transclude: true/'element',
compile: function (tElement, tAttrs, transclude) {
//transclude已被弃用
return{
pre: function preLink(scope,iElement,iAttrs,controller){},
post: function postLink(scope,iElement,iAttrs,controller){}
}
//or
return function (scope,iElement,iAttrs,controller){ }
},
link: function (scope, iElement, iAttrs, controller, transcludeFn) {
//controller:myselfController/string/array 没有设置require的话默认自己的controller
//myselfController指指令自己的controller,没有的话设置为undefined
transclude([scope], cloneLinkingFn, futureParentElement);
}
}
})

priority: 在同一个元素上的指令,数字越大优先级越高,优先级越高controller和pre-link函数越先执行,而post-link则相反。该项不适用不在同一元素上的指令

terminal:如果设置为true,那么该指令最后一个执行,优先级低于该指令的指令全都被忽略

scope:<mydir attr='variable' attr2='{{str}}' on-ok='foo(a)'></mydir>

    scope:{ attr:‘=’,   attr2:'@',  onOk:'&'}

    '='表示与属性中的变量双向绑定,与父作用域中的变量会相互影响,所以 attr= 后面必须跟一个变量;‘@’表示引用一个字符串之类的表达式;

    ‘&’表示引用一个函数,首先用一个function把他包裹起来,因此onOk=function(a){ foo(a); },如果表达式中包含函数表达式,那么需要将函数写在

    parent scope的function中,比如on-ok = ‘show=false’,直接用 ‘&’引用会报错, ‘show=false’ 只能用@,把他当做字符串处理,因此需要在父作用域中

    $scope.isShow=function(){$scope.show=false},然后on-ok='isShow()'才行

bindToController:设置为true的话,此属性会作为scope与controller联系的桥梁

    

controller:

.directive('hello',function(){
return {
restrict:'AE',
template:'<span>hello{{ that.ab }}</span>',
controller:'parent', //parent是模块上注册的controller
controllerAs:'that'
}
})//使用controllerAs的话会将parent作为构造函数实例化,否则就直接使用parent里的$scope

require:

Angularjs directive的更多相关文章

  1. 学习AngularJs:Directive指令用法

    跟我学AngularJs:Directive指令用法解读(上) http://blog.csdn.net/evankaka/article/details/51232895 跟我学AngularJs: ...

  2. angularjs directive 实例 详解

    前面提到了angularjs的factory,service,provider,这个可以理解成php的model,这种model是不带html的,今天所说的directive,也可以理解成php的mo ...

  3. 学习AngularJs:Directive指令用法(完整版)

    这篇文章主要学习AngularJs:Directive指令用法,内容很全面,感兴趣的小伙伴们可以参考一下   本教程使用AngularJs版本:1.5.3 AngularJs GitHub: http ...

  4. Angularjs directive全面解读(1.4.5)

    说到Angularjs directive即指令,可以这么说Angularjs的灵魂就是指令,学会Angularjs指令那么你的Angularjs的武功就修炼了一半了,当然这只是鄙人的一点点独到见解, ...

  5. angularjs directive (自定义标签解析)

    angularjs directive (自定义标签解析) 定义tpl <!-- 注意要有根标签 --> <div class="list list-inset" ...

  6. 步入angularjs directive(指令)--点击按钮加入loading状态

    今天我终于鼓起勇气写自己的博客了,激动与害怕并存,希望大家能多多批评指导,如果能够帮助大家,也希望大家点个赞!! 用angularjs 工作也有段时间了,总体感觉最有挑战性的还是指令,因为没有指令的a ...

  7. AngularJS Directive 隔离 Scope 数据交互

    什么是隔离 Scope AngularJS 的 directive 默认能共享父 scope 中定义的属性,例如在模版中直接使用父 scope 中的对象和属性.通常使用这种直接共享的方式可以实现一些简 ...

  8. [译]angularjs directive design made easy

    原文: http://seanhess.github.io/2013/10/14/angularjs-directive-design.html AngularJS directives很酷 Angu ...

  9. AngularJS directive 指令相关记录

    .... .directive('scopeDemo',function(){ return{ template: "<div class='panel-body'>Name: ...

  10. [转]通过AngularJS directive对bootstrap日期控件的的简单包装

    本文转自:http://www.cnblogs.com/Benoly/p/4109460.html 最近项目上了AngularJS,而原来使用的日期控件的使用方式也需要改变,于是开始了倒腾,看了官方的 ...

随机推荐

  1. JS中函数的调用和this的值

    调用每一个函数会暂停当前函数的执行,传递控制权和参数给新函数.除了声明时定义的形式参数,每个函数还接收两个附加的参数:this 和 arguments. 参数this在面向对象编程中非常重要,他的值取 ...

  2. Android中View的基础知识

    View的界限 View就是我们看到的界面,有四个界限范围分别是, Top/Left, Bottom/Right,坐标系从左上到右下.这四个值可以通过任何View的子类调用getTop()/get.. ...

  3. 关于springMVC3.0基于注解方式的项目搭建

    前言:开发了几个月的AS3项目,感觉JAVA都用不太熟练了.刚好这几个抽的空,就把自己以前用过的Spring框架再搭一边, 并完整的记录下来 开发环境:tomcat + mysql+ java 1.所 ...

  4. solaris tar 命令exclude使用

    压缩时需要排除指定目录,不知道什么原因在solaris中 tar cvf a.tar a --exclude=a/b/log --exclude = a/c/mm7log不生效, 最后使用了如下方法 ...

  5. spring入门教程——笔记

    Spring学习笔记(1)----简单的实例 ---------------------------------   首先需要准备Spring包,可从官方网站上下载.   下载解压后,必须的两个包是s ...

  6. c语言实现牛顿迭代法

    #include<stdio.h> #include<stdlib.h> #include<math.h> #include<float.h> #inc ...

  7. 作业8 Alpha阶段项目总结

    我们的扫雷游戏已经基本完成. 游戏共分3个难度 每个难度的格数和雷的格数也有不同 具体的游戏会在展示时候让大家看到 小组成员分数: 史劭聪 20分 马浩然 20分

  8. C#基础知识汇总

    过了一遍基础视频,发现有一些最基本的知识点还掌握的不够,汇总如下: 1) 占位符 string name = "张三"; ; decimal salary = 7600.33M; ...

  9. 访问本地Access 数据出错

    访问本地的access数据库时,出现了OleDbException 10Aug2015 晚: 好像找到了问题所在, 虽然不知道背后深层次的原因 改用了C#, 然后command 语句里也update了 ...

  10. RS232,RS422串口标准小结

    RS232和RS422都是广泛使用的异步串行接口标准.由于它们实现简单且占用IO口资源少,在低速传输下是不错的方案. RS232是单端走线,最高波特率为115200,传输最远距离不超过150米,它的逻 ...