溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
Angular指令之restict匹配模式的詳解
<body data-ng-app="myapp">
<runn2></runn2>
<div data-runn2></div>
<div class="runn2"></div>
<!-- directive: runn2 -->
<script>
var app=angular.module("myapp",[]);
app.directive('runn2',function(){
return{
restrict:"EACM",
replace:true,
template:"<h2>自定義指令</h2>"
};
});
</script>
restict匹配模式：分為四種：
1.元素匹配（E）:<runn2></runn2>
2.屬性匹配（默認A）<div data-runn2></div>
3.樣式類匹配（C）<div class="runn2"></div>
4.注釋匹配（M）<!-- directive: runn2 -->
注意：directive前面需要有空格runn2后面需要有空格（這是一個小坑）
注釋匹配無法增加多個標簽例：template:"<h2>自定義指令</h2><h3>自定義指令</h3>" 會導致報錯
但是在<div><h2>自定義指令</h2><h3>自定義指令</h3></div>這樣包含標簽卻是正常的，小坑一個
注意：必須replace=true，否則注釋匹配無法使用
推薦使用元素和屬性的方式使用指令
當需要創建帶有自己的模板的指令時，使用元素名稱的方式創建指令
當需要為已有的HTML標簽增加功能時，使用屬性的方式創建指令
以上就是Angular指令之restict匹配模式的實例詳解，本站有關AngularJS 的文章還有很多，希望大家搜索查閱，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
