本文实例讲述了AngularJS中$injector、$rootScope和$scope的概念和关联关系。分享给大家供大家参考，具体如下：
$injector、$rootScope和$scope是AngularJS框架中比较重要的东西，理清它们之间的关系，对我们后续学习和理解angularJS框架都非常有用。
1、$injector其实是一个IOC容器，包含了很多服务(类似于spring框架中的bean)，其它代码能够通过 $injector.get("serviceName")的方式，从injector中获取所需要的服务。详情参考这篇文章：《AngularJS的依赖注入实例分析(使用module和injector)》
2、scope是angularJS中的作用域(其实就是存储数据的地方)，很类似JavaScript的原型链。搜索的时候，优先找自己的scope，如果没有找到就沿着作用域链向上搜索，直至到达根作用域rootScope。
3、$rootScope是由angularJS加载模块的时候自动创建的，每个模块只会有1个rootScope。rootScope创建好会以服务的形式加入到$injector中。也就是说通过$injector.get("$rootScope");能够获取到某个模块的根作用域。更准确的来说，$rootScope是由angularJS的核心模块ng创建的。
示例1：
// 新建一个模块var module = angular.module("app",[]);// true说明$rootScope确实以服务的形式包含在模块的injector中var hasNgInjector = angular.injector(['app','ng']);console.log("has $rootScope=" + hasNgInjector.has("$rootScope"));//true// 获取模块相应的injector对象,不获取ng模块中的服务// 不依赖于ng模块,无法获取$rootScope服务var noNgInjector = angular.injector(['app']);console.log("no $rootScope=" + noNgInjector.has("$rootScope"));//false// 获取angular核心的ng模块var ngInjector = angular.injector(['ng']);console.log("ng $rootScope=" + ngInjector.has("$rootScope"));//true上面的代码的确可以说明：$rootScope的确是由核心模块ng创建的，并以服务的形式存在于injector中。
如果创建injector的时候，指定了ng模块，那么该injector中就会包含$rootScope服务；否则就不包含$rootScope。
示例2：
<!doctype html><html lang="en"> <head> <meta charset="utf-8"> <script src="angular-1.2.25.js"></script> <script> var module = angular.module("app",[]); // 控制器里的$injector,是由angular框架自动创建的 function FirstController($scope,$injector,$rootScope) { $rootScope.name="aty"; } //自己创建了个injector,依赖于app和ng模块 var myInjector = angular.injector(["app","ng"]); var rootScope = myInjector.get("$rootScope"); alert(rootScope.name);//udefined </script> </head> <body ng-app="app"> <div id="first" ng-controller="FirstController"> <input type="text" ng-model="name"> <br> {{name}} </div> </body></html>
新闻热点
疑难解答
图片精选
