视图和$scope的世界
AngularJS启动后并生成视图,会将ng-app同$rootScope进行绑定。$rootScope是所有$scope对象的顶层。相当于某一个ng-app的全局作用域。$scope对象只充当数据模型,不作处理和操作数据。
以下为$rootScope的例子:
<!doctype html> <html> <head> <script src="angularJs/1.2.13/angular.js"></script> </head> <body ng-app="myApp"> <div> hello {{name}} </div> </body> <script> var app = angular.module('myApp', []).run(function($rootScope){ $rootScope.name="world"; }); </script> </html>
上面的的例子在$rootScope中设置了一个name变量,并引用了它。为了避免污染全局命名空间,可以用控制器显式的创建一个隔离的$scope对象,再将变量设置到这个子变量上。使用ng-controller指令可以将一个控制器对象附加到DOM元素上。如下:
<!doctype html> <html> <head> <script src="angularJs/1.2.13/angular.js"></script> </head> <body ng-app="myApp"> <div ng-controller="MyController"> hello {{name}} </div> </body> <script> var app = angular.module('myApp', []); app.controller("MyController",function($scope){ $scope.name="Ari"; }) </script> </html>
$scope的生命周期
1.创建
创建控制器或指令时,$injector创建一个新的作用域,并在这个新的控制器或指令运行时将作用域传进去。
2.链接
当Angular开始运行时,所有的$scope对象都会附加到视图中。
3.更新
当事件循环运行时,通常执行顶层$scope对象,每个子作用域执行自己的脏值检测。检测到变换,就会触发指定的回调函数。
4.销毁
指令和作用域
指令通常不会创建自己的作用域,但ng-controller和ng-repeat指令会创建自己的作用域。