angularjs学习之七（angularjs中指令的四种基本形式）

迈不过友情╰ 2022-08-02 04:41 179阅读 0赞

指令的四种基本形式中，

注意注释型指令 M 的使用方法是  注意左右俩测必须有空格才会正常识别

所有指令是可以相互组合 的，不写restrict ，将会默认为A属性 指令

要支持IE8 浏览器 一般最好将指令设置为属性

<!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>
    		
    		
    		<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>