zoukankan      html  css  js  c++  java
  • ng-app一些使用

      ng-app是angular的一个指令,代表一个angular应用(也叫模块)。使用ng-app或ng-app=""来标记一个DOM结点,让框架会自动加载。也就是说,ng-app是可以带属性值的。如果想要实现自动加载,那么就不能让ng-app带有属性值。而带属性的ng-app自己主动载入我们自己定义的模块作为根模块

    <html>
    	<body ng-app>
    		<div>div1:{{1+3*2}}</div>
    		<script src="angular.js"></script>
    	</body>
    </html>  

      1、不含ng-app,无法自动加载。

    <html>
    	<body>
    		<div>div1:{{1+3*2}}</div>
    		<script src="angular.js"></script>
    	</body>
    </html>  

      2、含有2个ng-app,那么只会自动加载第一个。

    <html>
    	<body>
    		<div ng-app>div1:{{1+3*2}}</div>
    		<div ng-app>div2:{{1+3*2}}</div>
    		<script src="angular.js"></script>
    	</body>
    </html>
    

      3、如果根节点有ng-app含有2个ng-app,那么两个都会加载。

    <html>
    	<body ng-app=“”>
    		<div ng-app>div1:{{1+3*2}}</div>
    		<div ng-app>div2:{{1+3*2}}</div>
    		<script src="angular.js"></script>
    	</body>
    </html>  

      4、ng-app带有属性,不能自动加载

    <html>
    	<body>
    		<div ng-app="app1">div1:{{1+3*2}}</div>
    		<script src="angular.js"></script>
    	</body>
    </html>
    

      5、ng-app带有属性,可自动加载自己定义的模块

    <!DOCTYPE html>
    <html>	
    	<head>
    	<head>
    	<body>
    	  <div id="moudle1"  ng-app="rootMoudle" ng-controller="rootControl">div1:{{name}}</div>
    	</body>
    	<script src="angular.js"></script>
    	<script>
    	  var rootMoudle = angular.module('rootMoudle', []);		
    	  rootMoudle.controller("rootControl",function($scope){$scope.name="aty"});		
        </script>
    </html>
    

      6、angular.bootstrap()可以手动加载模块

    <html>
    	<head>			
    	<head>
    	<body>
    	   <div id="moudle1"  ng-app="rootMoudle" ng-controller="rootControl">div1:{{name}}</div>
    	</body>
    	<script src="angular-1.2.2/angular.js"></script>
    		<script>		
    		//页面载入完毕后,载入rootMoudle
    		angular.element(document).ready(function(){		
    			angular.bootstrap(document.getElementById("moudle1"), ['rootMoudle']);
    		});		
        </script>
    </html>
    

      

  • 相关阅读:
    "Emgu.CV.CvInvoke”的类型初始值设定项引发异常 解决办法
    EmguCV(OpenCV)实现高效显示视频(YUV)叠加包括汉字
    yuv420p转为emgucv的图像格式Emgu.CV.Image<Bgr, Byte>
    Emgu.CV/opencv 绘图 线面文字包括中文
    5.9 HTML5 新增表单控件 ---不是特别重要
    5.8 HTML5新结构标签
    5.8 HTML5新结构标签 ---不是特别重要
    5.7 CSS浏览器前缀
    5.6 CSS3 animation动画
    5.5 CSS3 transform变换
  • 原文地址:https://www.cnblogs.com/dfghjkl/p/5550215.html
Copyright © 2011-2022 走看看