<div ng-controller="ctrl1">
<superman weight length speed>superman</superman>
<superman weight >weight</superman>
</div>
<script type="text/javascript">
angular.module('myMoudle',[])
.controller('ctrl1', ['$scope', function($scope){
}])
.directive("superman", function(){
return {
restrict : "E",
scope : {},
controller : function($scope){
$scope.abilities = [];
this.addWeight = function(){
$scope.abilities.push("Weight");
}
this.addSpeed = function(){
$scope.abilities.push("Speed");
}
this.addLength = function(){
$scope.abilities.push("Length");
}
},
link : function(scope, element){
element.bind("mouseenter", function(){
console.log(scope.abilities);
})
}
}
})
.directive("weight", function(){
return {
restrict : "A",
require : "superman",
link : function(scope, element, attrs, superman){
superman.addWeight();
}
}
})
.directive("speed", function(){
return {
restrict : "A",
require : "superman",
link : function(scope, element, attrs, superman){
superman.addWeight();
}
}
})
.directive("length", function(){
return {
restrict : "A",
require : "superman",
link : function(scope, element, attrs, superman){
superman.addLength();
}
}
})
</script>
解释: directive 中的controller放一些公共部分
require : 通过require让多个指令共享controller中的数据
^ 允许从父类开始查找 require:"^superman"
? 如果找不到不抛出异常
scope : {} 创建独立作用域,没有原型继承
= or =attr “Isolate”作用域的属性与父作用域的属性进行双向绑定,任何一方的修改均影响到对方,这是最常用的方式;
@ or @attr “Isolate”作用域的属性与父作用域的属性进行单向绑定,即“Isolate”作用域只能读取父作用域的值,并且该值永远的String类型;
& or &attr “Isolate”作用域把父作用域的属性包装成一个函数,从而以函数的方式读写父作用域的属性,包装方法是$parse;
link : 主要做一些dom操作