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>

　　

ng-app一些使用的更多相关文章

  1. ng 依赖注入

    将依赖的对象注入到当前对象,直接去使用依赖的对象即可. 降低耦合度.提高开发速度.. 文件压缩:yui-compressor有两种方案:①CLI(command line interface)java ...

  2. ng $http 和远程服务器通信的一个服务。

    $http({url:'',method:''}).success().error() 简洁写法:$http.get()$http.post()... 注意事项:①要求返回的数据格式是json格式②在 ...

  3. ng $interval(周期性定时器) $timeout（延迟定时器）

    <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> <met ...

  4. ng $scope与$rootScope的关系

    $scope与$rootScope的关系:①不同的控制器之间 是无法直接共享数据②$scope是$rootScope的子作用域对象$scope的id是随着控制器的加载顺序依次递增,$rootScope ...

  5. ng 服务

    服务的本质是单例对象,封装一些方法和属性的. 单例模式:在实例化变量的时候,如果该变量已经存在,直接返回该变量:如果不存在,就创建一个新的变量再返回 ng自带的服务有很多,常用:$location $ ...

  6. ng json格式的序列化和反序列化

    ng中自带方法 angular.toJson 序列化angular.fromJson 反序列化 结果: 代码: <!DOCTYPE html> <html ng-app=" ...

  7. ng 过滤器

    1.ng中自带的过滤器过滤器:实现对数据的筛选.过滤.格式化. 过滤器是一个有返回值的方法. 过滤器语法:{{ expression |过滤器1:'参数' | 过滤器2:'参数' }} | --> ...

  8. ng 双向数据绑定 实现 注册协议效果

    效果: 代码: <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> ...

  9. ng 动态的生成option。

    ngOptions:根据集合,动态的生成option. select ng-options="color.name for color in colorList" 注意跟ng-re ...

  10. ng 实现插入和删除

    结果: 代码: <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> ...

随机推荐

  1. js获取可视区域高度

    document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...

  2. 精选30道Java笔试题解答

    转自:http://www.cnblogs.com/lanxuezaipiao/p/3371224.html 都 是一些非常非常基础的题,是我最近参加各大IT公司笔试后靠记忆记下来的,经过整理献给与我 ...

  3. 学习Struts2的第一个应用步骤

    ---恢复内容开始--- 一.在官网 http://struts.apache.org/下载struts-2.3.31-all 1.  打开struts-2.3.31-all,将struts-2.3. ...

  4. 每次更新obj和bin文件夹都生成nGB的文件

    今天受不了,把它们符号链接到机械硬盘上了 用mklink /d 创建的,也不知道和/j有什么区别

  5. awk命令速查

    awk与sed.grep一样都是为了加工数据流而做成的文本加工过滤器命令.awk会事先把输入的数据根据字段单位进行分割.在没有制定分割单位的情况下,以输入数据中的空格或Tab为分隔符.与sed相比,它 ...

  6. javascript 基础

    javascript概述: javascript历史: * 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEas ...

  7. linux基本命令

    常用命令: w 查看登入用户(第一行为主机负载) ifconfig -a 查看所有网络 dhclient 自动获取IP地址 关机命令 init0 shutdown -h now 重启命令 init 6 ...

  8. bzoj4443[SCOI2015]小凸玩矩阵

    题意:一个n*m的矩阵(n<=m<=250),要求选出n个数(每行,每列最多选一个),求第k大数的最小值. 首先第k大的意思是从大到小的第k个数(我读错了,WA了一次还以为算法不对...) ...

  9. ReactNative 根据scrollView/listview滑动距离动态修改NavBar颜色

    我们常见某些APP上滑的时候,NavBar颜色会从透明渐变为某种颜色 原理非常简单,根据scrollView的回调动态修改NavBar的透明度即可. 在RN中,尤其是ListView中这个回调不是很好 ...

  10. 【gulp】工作中的实战

    写这篇文章的目的是为了以后的项目中懒得再去配gulp,直接可以拿这篇博客中的来用,因为有时候配置还是挺烦人的. gulp相关插件的介绍 用法比较简单,假设大家都会用gulp,下面主要介绍一下一些插件的 ...