AngularJS视图和$scope的世界

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

有$scope对象的最上层 

$rootScope是AngularJS中最接近全局作用域的对象。在$rootScope上附加太多业

务逻并不是好主意,这与污染JavaScript的全局作用域是一样的。

$scope对象就是一个普通的JavaScript对象,我们可以在其上随意修改或添加属性。

12

34567891011

13

14

$scope对象在AngularJS中充当数据模型,但与传统的数据模型不一样,$scope并不负责处理和操作数据,它只是视图和HTML之间的桥梁,它是视图和控制器之间的胶水。

$scope的所有属性,都可以自动被视图访问到。假设我们有如下的HTML:

     <div ng-app="myApp">
       <h1>Hello {{ name }}</h1>

</div>
我们希望{{ name }}变量是本地$scope的一个属性,效果如图4-1所示。

     angular.module('myApp', [])
       .run(function($rootScope) {

         $rootScope.name = "World";
     });

图4-1 简单的$rootScope绑定