.directive的全部设置
angular.module('myApp', [])
.directive('myDirective', function() {
return {
restrict: String,
priority: Number,
terminal: Boolean,
template: String or Template Function: function(tElement, tAttrs)(...
},
templateUrl: String,
replace: Boolean or String,
scope: Boolean or Object,
transclude: Boolean,
controller: String or
function(scope, element, attrs, transclude, otherInjectables) {... },
controllerAs: String,
require: String,
link: function(scope, iElement, iAttrs) {... },
compile: // 返回一个对象或连接函数,如下所示:
function(tElement, tAttrs, transclude) {
return {
pre: function(scope, iElement, iAttrs, controller) {... },
post: function(scope, iElement, iAttrs, controller) {... }
}
// 或者
return function postLink(...) {... }
}
};
});
属性类型 | 属性值 | 是否可选 | 默认参数 | 备注 |
---|---|---|---|---|
restrict | string | 可选参数 | restrict: ‘EA’ | 指明指令在DOM中以什么形式被声明E:”元素”,A:“属性,默认值”,C:“类名”,M:注释“” |
priority | 数字 | 可选参数 | 默认值:0 | 指令的优先级,若在单个DOM元素上有多个指令,则优先级高的先执行 |
terminal | 布尔型 | 可选参数 | 若设置为true,则优先级低于此指令的其他指令则无效,不会被调用优先级相同任然会执行。 | |
template | 字符串或者函数 | 可选参数 | ||
replace | 布尔型 | 内容 | 默认值为false | 可以用模板内容替换自定义的元素标签,默认将元素插入到指令标签内部 |
templateUrl | 字符串或者函数 | 可选参数 | 可以使一个代表html文件路径的字符串,也可以是一个函数(tElement,tAttrs)其中t代表template,大致意思与template一样,会存在 一个跨域问题 | |
scope | 布尔值或者对象 | 可选参数 | 默认值为false表示继承父级作用域 | 如果值为true,表示继承父作用域,并创建自己的作用域(子作用域);如果为对象,{},则表示创建一个全新的隔离作用域。;@: 本地作用域属性 ,使用@符号将本地作用域同DOM属性的值进行绑定。指令内部作用域可以 使用外部作用域的变量=: 双向绑定:通过=可以将本地作用域上的属性同父级作用域上的属性进行双向的数据绑定。 就像普通的数据绑定一样,本地属性会反映出父数据模型中所发生的改变。 |
& 与父级的方法绑定transclude | 布尔值或者字符element | 默认值为false | 这个配置选项可以让我们提取包含在指令那个元素里面的内容,再将它放置在指令模板的特定位置。当我们开启transclude之后,我们就可以使用ng-transclude来指明应该在什么地方放置transclude的内容 | |
controller | 一个字符串或者函数 | 内容 | 若为字符串,则将字符串当做控制器的名字,来查找注册在应用中的控制器的构造函数。也可以直接在指令内部定义为匿名函数,同样可以注入任何服务 | |
controllerAs | 内容 | 内容 | 们就可以不用将属性和方法挂载到$scope上,而是this上。 | |
require | 字符串或者数组 | 内容 | 字符串代表另一个指令的名字,它将作为link函数的第四个参数 | |
内容 | 内容 | 内容 | 内容 |