Page 33 - AngularJS权威教程

4.2 就是 HTML 而已 13

$rootScope是AngularJS中最接近全局作用域的对象。在$rootScope上附加太多业 1
务逻并不是好主意，这与污染JavaScript的全局作用域是一样的。
$scope对象就是一个普通的JavaScript对象，我们可以在其上随意修改或添加属性。 2

$scope对象在AngularJS中充当数据模型，但与传统的数据模型不一样，$scope并不负责处
理和操作数据，它只是视图和HTML之间的桥梁，它是视图和控制器之间的胶水。 3
$scope的所有属性，都可以自动被视图访问到。假设我们有如下的HTML：

<div ng-app="myApp"> 4
<h1>Hello {{ name }}</h1>
</div>
5
我们希望{{ name }}变量是本地$scope的一个属性，效果如图4-1所示。
angular.module('myApp', []) 6
.run(function($rootScope) {
$rootScope.name = "World";
});
7

8

9

10

图4-1 简单的$rootScope绑定 11

4.2 就是 HTML 而已 12

我们的应用负责渲染HTML并将它交给浏览器来显示。这个HTML中包含了各种标准的
13
HTML元素，包括AngularJS特有的以及非AngularJS特有的元素。AngularJS不会对不包含
AngularJS特殊声明的元素进行任何处理。
14
<h2>Hello world</h2>
<h3>Hello {{ name }}</h3>
上面这个例子中，AngularJS不会处理<h2>元素，但是会在作用域发生变化时更新<h3>元素。 15
我们可以在AngularJS应用的模板中使用多种标记，包括下面这些。
16
 指令：将DOM元素增强为可复用的DOM组件的属性或元素。
 值绑定：模板语法{{ }}可以将表达式绑定到视图上。
 过滤器：可以在视图中使用的函数，用来进行格式化。 17
 表单控件：用来检验用户输入的控件。
18