一 angularJS中几种注入方式
Spring中使用构造注入或者设值注入的方式，还需要做一些额外的操作，但是angular中只需要在需要的地方声明一下即可，类似模块的引用，因此十分方便。
angularJS中有几种注入方式：
推断式注入：这种注入方式，需要在保证参数名称与服务名称相同。如果代码要经过压缩等操作，就会导致注入失败。
<div ng-controller="myCtrl1">
<input type="button" ng-click="hello()" value="ctrl1"></input>
</div>
<div ng-controller="myCtrl2">
<input type="button" ng-click="hello()" value="ctrl2"></input>
</div>
<div ng-controller="myCtrl3">
<input type="button" ng-click="hello()" value="ctrl3"></input>
</div>
<script type="text/javascript">
var app = angular.module("myApp",[]);
app.factory("hello1",function(){
return {
hello:function(){
console.log("hello1 service");
}
}
});
app.factory("hello2",function(){
return {
hello:function(){
console.log("hello2 service");
}
}
});
app.controller("myCtrl1", function($scope,hello1,hello2){
$scope.hello = function(){
hello1.hello();
hello2.hello();
}
});
...
标记式注入：这种注入方式，需要设置一个依赖数组，数组内是依赖的服务名字，在函数参数中，可以随意设置参数名称，但是必须保证顺序的一致性。
var myCtrl2 = function($scope,hello1,hello2){
$scope.hello = function(){
hello1.hello();
hello2.hello();
}
}
myCtrl2.$injector = ['hello1','hello2'];
app.controller("myCtrl2", myCtrl2);
内联式注入：这种注入方式直接传入两个参数，一个是名字，另一个是一个数组。这个数组的最后一个参数是真正的方法体，其他的都是依赖的目标，但是要保证与方法体的参数顺序一致(与标记注入一样)。
app.controller("myCtrl3",['$scope','hello1','hello2',function($scope,hello1,hello2){
$scope.hello = function(){
hello1.hello();
hello2.hello();
}
}]);
在angular中，可以通过angular.injector()获得注入器:var $injector = angular.injector();
通过$injector.get('serviceName')获得依赖的服务名字:$injector.get('$scope');
通过$injector.annotate('xxx')获得xxx的所有依赖项 :$injector.annotate(xxx)
二 angularJS中的$injector、$rootScope和$scope
1.$injector其实是一个IOC容器，包含了很多服务(类似于spring框架中的bean)，其它代码能够通过。$injector.get("serviceName")的方式，从injector中获取所需要的服务。
2.scope是angularJS中的作用域(其实就是存储数据的地方)，很类似javascript的原型链。搜索的时候，优先找自己的scope，如果没有找到就沿着作用域链向上搜索，直至到达根作用域rootScope。
3.$rootScope 是由angularJS加载模块的时候自动创建的，每个模块只会有1个rootScope。rootScope创建好会以服务的形式加入 到$injector中。也就是说通过$injector.get("$rootScope");能够获取到某个模块的根作用域。更准确的来 说，$rootScope是由angularJS的核心模块ng创建的。
4.$rootScope的确是由核心模块ng创建的，并以服务的形式存在于injector中。
// 新建一个模块
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
如果创建injector的时候，指定了ng模块，那么该injector中就会包含$rootScope服务；否则就不包含$rootScope。
<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>
angular.injector()可以调用多次，每次都返回新建的injector对象。所以我们自己创建的myInjector和angular自动创建的$injector不是同一个对象，那么得到的rootScope也就不是同一个。
<html lang="en">
<head>
<script src="angular-1.2.25.js"></script>
<script>
function FirstController($scope,$injector,$rootScope)
{
// true
console.log("scope parent :" + ($scope.$parent ==$rootScope));
}
</script>
</head>
<body ng-app>
<div id="first" ng-controller="FirstController">
<input type="text" ng-model="name">
<br>
{{name}}
</div>
</body>
</html>
ng-controller指令给所在的DOM元素创建了一个新的$scope对象,并作为rootScope的子作用域。$scope是由$rootScope创建的，$scope不会包含在$injector中。
- 7_nodejs angularjs
webstrom使用: ctrl+b/点击,代码导航,自动跳转到定义 ctrl+n跳转指定类 ctrl+d复制当前行ctrl+enter另起一行ctrl+y删除当前行 ctrl+alt/shift+b ...
- angular.js:13920 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- testServe
angular.js:13920 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- testSer ...
- AngularJS API之$injector ---- 依赖注入
在AngularJS中也有依赖注入的概念,像spring中的依赖注入,但是又有所不同.Spring中使用构造注入或者设值注入的方式,还需要做一些额外的操作,但是angular中只需要在需要的地方声明一 ...
- AngularJS源码分析之依赖注入$injector
开篇 随着javaEE的spring框架的兴起,依赖注入(IoC)的概念彻底深入人心,它彻底改变了我们的编码模式和思维.在IoC之前,我们在程序中需要创建一个对象很简单也很直接,就是在代码中new O ...
- 我的angularjs源码学习之旅1——初识angularjs
angular诞生有好几年光景了,有Google公司的支持版本更新还是比较快,从一开始就是一个热门技术,但是本人近期才开始接触到.只能感慨自己学习起点有点晚了.只能是加倍努力赶上技术前线. 因为有分析 ...
- angular源码阅读，依赖注入的原理：injector,provider,module之间的关系。
最开始使用angular的时候,总是觉得它的依赖注入方式非常神奇. 如果你跳槽的时候对新公司说,我曾经使用过angular,那他们肯定会问你angular的依赖注入原理是什么? 这篇博客其实是angu ...
- 给返回的injector增加了一个invoke方法
我们知道,这里swap只需交换指针指向就可以,所以我们可以写出如下自定义版本的swap函数: 首先,它把一个独立的文件看成一个模块,比如上面的 hello.js 文件,就可以当成一个模块.模块的名称就 ...
- Nutch主要类代码分析之一（Injector）
Injector(org.apache.nutch.crawl.Injector): 输入:种子列表文件所在的目录 输出:crawldb(保存URL以及其相应信息的数据库) 作用:把种子URL注入到c ...
- angular源码分析：injector.js文件分析——angular中的依赖注入式如何实现的（续）
昨天晚上写完angular源码分析:angular中jqLite的实现--你可以丢掉jQuery了,给今天定了一个题angular源码分析:injector.js文件,以及angular的加载流程,但 ...
- AngularJs angular.injector、angular.module
angular.injector 创建一个injector对象, 调用injector对象的方法可用于获取服务以及依赖注入. 格式:angular.injector(modules); modules ...
随机推荐
- Oracle AWR报告指标全解析-11011552
1-5 Top 5 Timed EventsWaits : 该等待事件发生的次数, 对于DB CPU此项不可用Times : 该等待事件消耗的总计时间,单位为秒, 对于DB CPU 而言是前台进程所消 ...
- Vijos1352 NOI2006 最大获利 最小权闭合图
Orz胡伯涛<最小割模型在信息学竞赛中的应用> 建图方法: 设立源点S和汇点T,S和用户(共M个)连边,载流量为满足其要求的获利 T和中转站(共N个)连边,载流量为建立该中转站的费用 每个 ...
- 【POJ1151】【扫描线+线段树】Atlantis
Description There are several ancient Greek texts that contain descriptions of the fabled island Atl ...
- PHPCMS 使用图示和PHPCMS二次开发教程(转）
PHPCMS V9 核心文件说明 模块与控制器 模块: phpcms v9框架中的模块,位于phpcms/modules目录中 每一个目录称之为一个模块.即url访问中的m. 访问content模块示 ...
- 关于Weblogic 10.3.1集群及调优经历
一. 集群 ·集群易于管理.灵活的负载平衡.较强的安全机制 ·配置前的规划 操作系统 硬件配置 角色 windows IP: 192.168.1.101:7001 AdminServer windo ...
- Application.Exit()结束程序，但线程还在的解决方法
转自:http://bbs.51cto.com/thread-970057-1.html 出现此情况大多原因是使用了多线程编程,或者你所调用的dll使用了多线程. 我们知道,一般情况下的线程执行完指 ...
- spring 构造注入 异常 Ambiguous constructor argument types - did you specify the correct bean references as constructor arguments
你可能在做项目的时候,需要在项目启动时初始化一个自定义的类,这个类中包含着一个有参的构造方法,这个构造方法中需要传入一些参数. spring提供的这个功能叫“构造注入”, applicationCon ...
- Apache配置完虚拟主机后，使用Chrome访问localhost还是默认目录htdocs
Chrome 解析DNS出错,这个错误比较罕见,甚至说有点奇特.今天在使用Apache配置虚拟主机时,出现了一个非常奇怪的现象.我按照配置的步骤配置虚拟主机,如下 配置虚拟主机的步骤如下: 1. 启用 ...
- PHP面向对象(OOP):__call()处理调用错误
在程序开发中,如果在使用对象调用对象内部方法时候,调用的这个方法不存在那么程序就会出错,然后程序退出不能继续执行.那么可不可以在程序调用对象内部 不存在的方法时,提示我们调用的方法及使用的参数不存在, ...
- BAE 环境下配置 struts2 + spring + hibernate（SSH）（一）准备
1.首先选择版本控制 SVN 或者 Git ,但是由于Git在windows下需要环境,所以优先选择SVN. 2.安装一个SVN客户端 windows下使用TortoiseSVN:立即下载 注意:BA ...
