controller - 这个是指令内部的controller,跟angular中的controller不一样。它的作用是暴露此指令的一些方法给其他指令使用。这个控制器函数是在预编译阶段被执行的,并且它是共享的,这就使得指令间可以互相交流来扩大自己的能力。
require - 请求将另一个指令,假设为direct2,中的内部controller作为参数传入到当前指令的链接函数link中,这样在当前指令的link函数中,就可以调用direct2指令中的内部controller中定义的方法了。 这个请求需要传递被请求指令的名字。如果没有找到,就会触发一个错误。请求的名字可以加上下面两个前缀:
? - 不要触发错误,这只是一个可选的请求。
^ - 没找到的话,在父元素的作用域里面去查找有没有。
restrict - EACM中的任意一个字母。它是用来限制指令的声明格式的。如果没有这一项。那就只允许使用属性形式的指令。
E - 元素名称:<my-directive></my-directive>
A - 属性: <div my-directive="exp"> </div>
C - 类名:<div></div>
M - 注释: <!-- directive: my-directive exp -->
模板template - 将当前的元素替换掉。 这个替换过程会自动将元素的属性和css类名添加到新元素上。
模板地址templateUrl - 和template属性一样,只不过这里指示的是一个模板的URL。因为模板加载是异步的,所有编译和链接都会等到加载完成后再执行。
替换replace - 如果被设置成true,那么页面上指令内部里面的内容会被模板替换。比如:<hello><div>这是指令内部的内容</div></hello>,hello指令内部的div内容将会被模板替换掉。
transclude - 如果不想让指令内部的内容被模板替换,可以设置这个值为true。一般情况下需要和ngTransclude指令一起使用。 比如:template:"<div>hello every <div ng-transclude></div></div>",这时,指令内部的内容会嵌入到ng-transclude这个div中。也就是变成了<div>hello every <div>这是指令内部的内容</div></div>
编译compile - 这就是后面将要讲到的编译函数。
链接link - 这就是后面将要讲到的链接函数。
编译函数 Compile functionfunction compile(tElement, tAttrs, transclude) { ... }
编译函数是用来处理需要修改模板DOM的情况的。因为大部分指令都不需要修改模板,所以这个函数也不常用。需要用到的例子有ngTrepeat,这个是需要修改模板的,还有ngView这个是需要异步载入内容的。编译函数接受以下参数。
tElement - template element - 指令所在的元素。对这个元素及其子元素进行变形之类的操作是安全的。
tAttrs - template attributes - 这个元素上所有指令声明的属性,这些属性都是在编译函数里共享的。
transclude - 一个嵌入的链接函数function(scope, cloneLinkingFn)。
注意:在编译函数里面不要进行任何DOM变形之外的操作。 更重要的,DOM监听事件的注册应该在链接函数中做,而不是编译函数中。
编译函数可以返回一个对象或者函数。
返回函数 - 等效于在编译函数不存在时,使用配置对象的link属性注册的链接函数。
返回对象 - 返回一个通过pre或post属性注册了函数的对象。参考下面pre-linking和post-liking函数的解释。
链接函数 Linking functionfunction link(scope, iElement, iAttrs, controller) { ... }
链接函数负责注册DOM事件和更新DOM。它是在模板被克隆之后执行的,它也是大部分指令逻辑代码编写的地方。
scope - 指令需要监听的作用域。
iElement - instance element - 指令所在的元素。只有在postLink函数中对元素的子元素进行操作才是安全的,因为那时它们才已经全部链接好。
iAttrs - instance attributes - 实例属性,一个标准化的、所有声明在当前元素上的属性列表,这些属性在所有链接函数间是共享的。
controller - 控制器实例,也就是当前指令通过require请求的指令direct2内部的controller。比如:direct2指令中的controller:function(){this.addStrength = function(){}},那么,在当前指令的link函数中,你就可以通过controller.addStrength进行调用了。
Pre-linking function 在子元素被链接前执行。不能用来进行DOM的变形,以防链接函数找不到正确的元素来链接。
Post-linking function 所有元素都被链接后执行。
属性 AttributesThe Attributes object属性对象 - 作为参数传递给链接函数和编译函数。这使得下列资源可以被使用。