AngularJS 指令除了基本了的 app、init、model、repeat我们还可以调用自己定义的指令，调用方式有四种：
E ：元素名
A：属性
C：类名
M：注释
元素名
<!DOCTYPE html><html><head>
<meta charset="utf-8">
<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body ng-app="app"><test></test><script>
var app = angular.module("app", []);
app.directive("test", function () { return {
restrict: "E", //可省略，默认是EA，即元素名和属性
template: "这是自定义的通过元素名调用"
}
})</script></body></html>//这是自定义的通过元素名调用属性
<body ng-app="app"><div test></div><script>
var app = angular.module("app", []);
app.directive("test", function () { return {
restrict: "A", //可省略，默认是EA，即元素名和属性
template: "这是自定义的通过属性调用"
}
})</script></body>//这是自定义的通过属性调用类名
<body ng-app="app"><div class=" test"></div><script>
var app = angular.module("app", []);
app.directive("test", function () { return {
restrict: "C",
template: "这是自定义的通过类名调用"
}
})</script></body>//这是自定义的通过类名调用注释
<body ng-app="app"> <!-- directive: test -->
<script>
var app = angular.module("app", []);
app.directive("test", function () { return {
restrict: "M",
replace : true,
template: "<h1>这是自定义的通过注释调用</h1>"
}
})</script></body>//这是自定义的通过注释调用PS：一定要在 test 左右留空格；
作者：H_婷
链接：https://www.jianshu.com/p/8e5109c67a2a
点击查看更多内容
为 TA 点赞
评论
共同学习，写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持，我会继续努力的～
扫码打赏，你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫，即可进行扫码打赏哦