AngularJS中指令的四種基本形式實(shí)例分析
本文實(shí)例講述了AngularJS中指令的四種基本形式。分享給大家供大家參考,具體如下:
指令的四種基本形式中,
注意注釋型指令 M 的使用方法是 <!-- directive:指令名稱 --> 注意左右倆測(cè)必須有空格才會(huì)正常識(shí)別
所有指令是可以相互組合 的,不寫restrict ,將會(huì)默認(rèn)為A屬性 指令要支持IE8 瀏覽器 一般最好將指令設(shè)置為屬性
<!doctype html> <html ng-app="myapp"> <head> <meta charset="utf-8"/> </head> <body> <elementtag>E</elementtag> <div attr>A</div> <div class="classnamw">C</div> <!-- 注意注釋變量?jī)蓚?cè)必須加上空格 否則不會(huì)正確執(zhí)行這個(gè)指令 --> <!-- directive:commit --> <div></div> <script src="./js/angular.min.js"></script> <script> var app = angular.module('myapp',[]); app.directive('elementtag',function(){ return { restrict:"E", //元素指令 link:function(scope,element,attrs){ console.log("this is a element"); } }; }) .directive('attr',function(){ return { restrict:"A", //屬性指令 link:function(scope,element,attrs){ console.log("this is a attribute"); } }; }) .directive('classnamw',function(){ return { restrict:"C", //class 指令 link:function(scope,element,attrs){ console.log("this is a class"); } }; }) .directive('commit',function(){ return { restrict:"M", //注釋指令 link:function(scope,element,attrs){ console.log("this is a commit"); } }; }); </script> </html>
希望本文所述對(duì)大家AngularJS程序設(shè)計(jì)有所幫助。
相關(guān)文章
Web開發(fā)使用Angular實(shí)現(xiàn)用戶密碼強(qiáng)度判別的方法
這篇文章主要介紹了Web開發(fā)使用Angular實(shí)現(xiàn)用戶密碼強(qiáng)度判別的方法,需要的朋友可以參考下2017-09-09AngularJS 輸入驗(yàn)證詳解及實(shí)例代碼
本文主要介紹AngularJS 輸入驗(yàn)證,這里對(duì)AngularJS 輸入驗(yàn)證的資料做了整理,并附簡(jiǎn)單實(shí)例代碼和效果圖,有需要的小伙伴參考下2016-07-07angular基于路由控制ui-router實(shí)現(xiàn)系統(tǒng)權(quán)限控制
這篇文章主要介紹了angular基于路由控制ui-router實(shí)現(xiàn)系統(tǒng)權(quán)限控制的相關(guān)資料,需要的朋友可以參考下2016-09-09淺談Angular7 項(xiàng)目開發(fā)總結(jié)
這篇文章主要介紹了淺談Angular7 項(xiàng)目開發(fā)總結(jié),本文在此做一次遇到問題的總結(jié),以便知識(shí)的掌握,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-12-12詳解Angularjs在控制器(controller.js)中使用過濾器($filter)格式化日期/時(shí)間實(shí)例
本篇文章主要介紹了詳解Angularjs在控制器(controller.js)中使用過濾器($filter)格式化日期/時(shí)間實(shí)例 ,有需要的小伙伴可以參考下。2017-02-02AngularJS對(duì)動(dòng)態(tài)增加的DOM實(shí)現(xiàn)ng-keyup事件示例
這篇文章主要介紹了AngularJS對(duì)動(dòng)態(tài)增加的DOM實(shí)現(xiàn)ng-keyup事件示例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-03-03