zoukankan      html  css  js  c++  java
  • angularjs学习之七(angularjs中指令的四种基本形式)

    指令的四种基本形式中,

    注意凝视型指令 M 的用法是 <!--  directive:指令名称  --> 注意左右俩測必须有空格才会正常识别

    全部指令是能够相互组合 的。不写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>
    		<!-- 注意凝视变量两側必须加上空格 否则不会正确运行这个指令 -->
    		<!-- 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>



  • 相关阅读:
    vue后台管理系统项目
    javascript面试题
    webpack学习
    js全局变量收集器
    Koa2框架token验证
    require.js使用
    Koa2中使用art-template模板和静态资源托管
    Koa2POST请求参数
    H5、C3、ES6的新特性
    H5视频播放
  • 原文地址:https://www.cnblogs.com/wgwyanfs/p/7242856.html
Copyright © 2011-2022 走看看