1、HTML中的定义方式与指令中可以不同，HTML中用XXXX-XXXX，在指令中用驼峰式，或者不用驼峰，形势一直。
2、可以在元素、属性、类名创建属性。
<lio></lio>
<div lio></div>
<p class="lio"></p>
<script>
var a=angular.module('lio',[]);
a.directive('lio',function(){
return{
restrict:'EAC',
template:'<a href="#">click here</a>',
replace:true
}
})
</script>
3、向指令中传数据
第一种：由所述控制器提供已经存在的作用域
把DOM中的值复制给指令的作用域，采用绑定机制。
<div my-lio my-name="http:\\" click-here="click me"></div>
<script>
var a=angular.module('lio',[]);
a.directive('myLio',function(){
return{
restrict:'EAC',
template:'<a href="{{myName}}">{{clickHere}}</a>',
replace:true,
scope:{
myName:'@',
clickHere:'@'
}
}
});
</script>
还可以绑定到指定的属性当中，如
<script>
var a=angular.module('lio',[]);
a.directive('myLio',function(){
return{
restrict:'EAC',
template:'<a href="{{myName}}">{{clickHere}}</a>',
replace:true,
scope:{
myName:'@',
clickHere:'@myName'
}
}
});
</script>
流程是：DOM复制到指令作作用域中（scope），指令作用域再对应template中的。
@绑定是一一对应。
第二种：数据绑定形式ng-model
模板中的数据初始化高于控制器中的：
<body ng-app="lio">
<div ng-controller="c">
<input type="text" ng-model="v.name" ng-init="v.name='sa'"/>
<span ng-bind="v.name"></span>
</div>
</body>
<script>
var a=angular.module('lio',[]);
a.controller('c',function($scope){
var v={};
v.name="Hello";
$scope.v=v;
})
</script>
2775
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
