app.directive(‘datetimepicker‘,function(){
return {
restrict : ‘A‘,
scope :true,
require:[
‘?^add‘
,
‘?^minor‘
],
link: function (scope, element, attrs) {}
})
restrict
//E:表示该directive仅能以element方式使用,即:<my-dialog></my-dialog>
//A: 表示该directive仅能以attribute方式使用,即:<div my-dialog></div>
//C:样式,即:<div class="my-dialog:product"></div>
//M:注释,即<!--directive:my-dialog:product-->
//可以简单理解为,当directive被angular 编译后,执行该方法
scope
//scope 当你写上该属性时,就表示这个directive不会从它的controller里继承$scope对象,而是会重新创建一个。
//scope的属性简洁但语法复杂,你可以用符号例如:&,@ 和=来定义属性的绑定方式。
使用
@ 绑定父级作用域]监测属性的结果。eg:scope:{note:‘@‘}
是在属性里解析表达式的,也构建了一个可重用的功能表达式构造器会生成了一个依赖父级scope的方法。你可以随时执行他,甚至可以监测到输出的变化。
使用
= 设置 本地scope与父级scope间的双向数据绑定。
template:‘{{note()}}‘
link:function(scope,element,attrs){
var parentGet=$parse(attrs.a);//$parse 将一个AngularJS表达式转换成一个函数
}
link
//element简单说就是$(‘my-dialog‘)
//attrs是个map,内容是你这个directive上的所有属性
//someCtrl,最后一个就是通过require获取的controller的名字,内部控制器
link:function(scope,element,attrs){
attrs.$observe(‘a‘,function(){ //检测属性的变化
});
}
?require选项的值可以分别用前缀?、^ 和?^进行修饰,也可以不修饰。相当于注入控制器
如果不进行修饰,比如require:‘thisDirective‘,那么require只会在当前指令中查找控制器
如果想要指向上游的指令,那么就是用^进行修饰,比如require:‘^parentDirective‘,如果没有找到,那就会抛出一个错误。
如果使用?前缀,就意味着如果在当前指令没有找到控制器,就将null作为link的第四个参数;
那么,如果将?和^结合起来,我们就可以既指定上游指令,又可以在找不到时,不抛出严重的错误
link:function(scope,element,attrs,resultCtrl){
angular.element(document.querySelector(
‘#minor‘
)).on(
‘click‘
,resultCtrl[1].reduceCount);
//resultCtrl[0]就是?^add,
//resultCtrl[1]就是?^minor,
}