標籤：osi pad -- [] 添加 obd pos blog 元素
除了 AngularJS 內建的指令外，我們還可以建立自訂指令。
你可以使用 .directive 函數來添加自訂的指令。
要調用自訂指令，HTML 元素上需要添加自訂指令名。
使用駝峰法來命名一個指令， runoobDirective, 但在使用它時需要以 - 分割, runoob-directive:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> </head><body ng-app="myApp"><runoob-directive></runoob-directive><script>var app = angular.module("myApp", []);app.directive("runoobDirective", function() { return { template : "<h1>自訂指令!</h1>" };});</script></body></html>
你可以通過以下方式來調用指令：
<!DOCTYPE html><html><head> <meta charset="utf-8"> <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body ng-app="myApp"><runoob-directive></runoob-directive><div runoob-directive></div><div class="runoob-directive"></div><!-- directive: runoob-directive --><script> var app = angular.module("myApp", []); app.directive("runoobDirective", function() { return { restrict : "EACM", template : "<h1>自訂指令!</h1>" }; });</script></body></html>
restrict 值可以是以下幾種:
E 作為元素名使用A 作為屬性使用C 作為類名使用M 作為注釋使用restrict 預設值為 EA, 即可以通過元素名和屬性名稱來調用指令。
AngularJS:directive自訂的指令
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
