重新开始学习AngularJS,把学到的一些东西记录下来。
今天学习AngularJS的自定义属性,按照runoob上面的例子联系一下,原文地址:http://www.runoob.com/angularjs/angularjs-directives.html
1. 使用元素名作为自定义属性:
<body ng-app="myApp">
<runoob-directive></runoob-directive>
<script>
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {
template : "<h1>自定义指令!</h1>"
};
});
</script>
</body>
2. 使用元素属性作为自定义属性:
<body ng-app="myApp">
<div runoob-directive></div>
<script>
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {
restrict:"A",
template : "<h1>自定义指令!</h1>"
};
});
</script>
限制自定义指令的使用方式:
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {
restrict : "A",
template : "<h1>自定义指令!</h1>"
};
});
restrict 值可以是以下几种:
-
E
作为元素名使用 -
A
作为属性使用 -
C
作为类名使用 -
M
作为注释使用
restrict 默认值为 EA
, 即可以通过元素名和属性名来调用指令。