众所周知:

ng-app 指令用于告诉 AngularJS 应用当前这个元素是根元素。所有 AngularJS 应用都必须要要一个根元素。

只有被具有ng-app属性的DOM元素包含的元素才会受angularJS影响

使用ng-app声明Angular的边界,你可以用ng-app 指令告诉Angular 应该管理页面中的哪一块,可以是整个HTML,也可以是某个div

HTML 文档中只允许有一个 ng-app 指令,如果有多个 ng-app 指令,则只有第一个会被使用,一个页面会自动加载第一个ng-app。

AngularJS启动并生成视图时,会将根ng-app元素同$rootScope进行绑定。

一个ng-app可以有多个controller,$scope的范围局限于每一个controller中。

$rootScope是所有$scope对象的最上层

ng-app 声 明 所 有 被 它 包 含 的 元 素 都 属 于 AngularJS 应 用 ,

DOM 元 素 上 的ng-controller声明所有被它包含的元素都属于某个控制器

问题来了:

我就是想要多个ng-app,虽然这样做不知道有什么用???

有例子如下:

<!DOCTYPE html>
<html>
<script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script>
<body> <div id="app1" ng-app="App1">
<span ng-controller="myCtrl" ng-init="firstName='John' ; lastName='DoeDoe'">{{ firstName + " " + lastName }}</span>
<br>
<span ng-controller="yourCtrl">{{ secondName + " " + thirdName}}</span>
</div>
<br> <div id="app2" ng-app="App2" ng-controller="yourCtrl">
{{ secondName + " " + thirdName }}
</div> <script>
var app = angular.module("App1", []);
app.controller("myCtrl", function($scope) {
// $scope.lastName = "Doe";
});
app.controller("yourCtrl", function($scope) {
$scope.secondName = "小米1";
$scope.thirdName = "大米1";
}); var app1 = angular.module('App2', []);
app1.controller("yourCtrl", function($scope) {
$scope.secondName = "小米4";
$scope.thirdName = "小米5";
}); //默认加载app1,通过下面的代码显示启动app2,但是必须写在app2申明之后
angular.bootstrap(document.getElementById("app2"), ['App2']);
</script> </body>
</html>

AngularJs学习笔记(1)——ng-app的更多相关文章

  1. AngularJs学习笔记--Forms

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...

  2. AngularJs学习笔记--expression

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...

  3. AngularJs学习笔记--directive

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...

  4. AngularJs学习笔记--Using $location

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/dev_guide.services.$location 一.What does it do? $loc ...

  5. AngularJs学习笔记--Dependency Injection(DI,依赖注入)

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/di 一.Dependency Injection(依赖注入) 依赖注入(DI)是一个软件设计模式,处理 ...

  6. AngularJs学习笔记--bootstrap

    AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...

  7. AngularJs学习笔记--concepts(概念)

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...

  8. AngularJS学习笔记2——AngularJS的初始化

    本文主要介绍AngularJS的自动初始化以及在必要的适合如何手动初始化. Angular <script> Tag 下面通过一小段代码来介绍推荐的自动初始化过程: <!doctyp ...

  9. AngularJs学习笔记--unit-testing

    原版地址:http://docs.angularjs.org/guide/dev_guide.unit-testing javascript是一门动态类型语言,这给她带来了很强的表现能力,但同时也使编 ...

  10. AngularJs学习笔记--Managing Service Dependencies

    原版地址:http://docs.angularjs.org/guide/dev_guide.services.managing_dependencies angular允许service将其他ser ...

随机推荐

  1. 如何通过chrome的开发者工具查找新浪评论数据在哪个文件

    1.打开开发者工具(ctrl+shift+i) 2.打开搜索(Esc) 示例:http://comment5.news.sina.com.cn/page/info?format=js&chan ...

  2. 树状数组优化DP 【模拟赛】删区间

    哇,难受得一匹. 看到题的一瞬间竟然只想到了\(n^3\)的区间\(DP\) 一.\(40pts\) 设\(f[i][j]\)代表删去\(i\)到\(j\)这一段区间的最小代价和. 然后直接写普通的区 ...

  3. 读《thinking in java》第一遍笔记

    1.System.out.println(variable)为什么会调用重写的toString方法? 根据我搜到的信息结合源代码,得到以下结论,如有误请告知. 首先我们看一下println方法的源代码 ...

  4. hadoop遇到的问题(汇总)

    1. 如果Map和reduce的输出不一致,需要显示的设置Map的输出,没有根据参数进行推导的原因是类型擦除 combiner是在copy数据到机器之前可以进行的一些数据的合并,这和数据有关,不是所有 ...

  5. 21、Flask实战第21天:常用的Flask钩子函数

    在Flask中钩子函数是使用特定的装饰器装饰的函数.为什么叫钩子函数呢?是因为钩子函数可以在正常执行的代码中,插入一段自己想要执行的代码.那么这种函数就叫做钩子函数. before_first_req ...

  6. ubuntu16.04怎么设置宽带连接

    第一步,安装pppoecof 打开终端,输入命令sudo apt-get install pppoeconf 安装成功之后,开始手动配置. 第二步,配置连接 打开终端,输入命令pppoeconf 接下 ...

  7. 【动态规划】Gym - 100923A - Por Costel and Azerah

    azerah.in / azerah.out Por Costel the Pig has received a royal invitation to the palace of the Egg-E ...

  8. [ARC087D]FT Robot

    题目大意: 一个机器人按照给定的一系列指令进行运动. 总共有两种指令: T:向某个方向旋转90度. F:向当前所朝的方向走一个单位长度. 一开始机器人站在原点,且朝向x的正半轴方向,问机器人是否可能会 ...

  9. 1.1(java学习笔记) 面向过程与面向对象

    面向过程思考时,我们会先思考具体的步骤,第一步走什么,第二步做什么. 比如电脑新建文件夹,第一步:打开电脑 第二步:按下鼠标右键. 第三步:找到新建选项 第四步:点击新建选项下的文件夹 c语言是典型的 ...

  10. JavaSE目录

    常识,环境变量,注释 标示符,常量,进制转换,类型转换,位运算符,语句 数组,函数 面向对象 多线程 String 包装类 集合 其他对象 IO流,IO流--FileReader&&F ...