AngularJS API之$injector ---- 依赖注入
在AngularJS中也有依赖注入的概念，像spring中的依赖注入，但是又有所不同。Spring中使用构造注入或者设值注入的方式，还需要做一些额外的操作，但是angular中只需要在需要的地方声明一下即可，类似模块的引用，因此十分方便。
参考：[angular api doc] (http://docs.angularjs.cn/api/auto/service/$injector)
推断式注入
这种注入方式，需要在保证参数名称与服务名称相同。如果代码要经过压缩等操作，就会导致注入失败。
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();
}
}]);
$injector常用的方法
在angular中，可以通过angular.injector()获得注入器。
var $injector = angular.injector();
通过$injector.get('serviceName')获得依赖的服务名字
$injector.get('$scope')
通过$injector.annotate('xxx')获得xxx的所有依赖项
$injector.annotate(xxx)
样例代码
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body ng-app="myApp">
<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");
}
}
});
var $injector = angular.injector();
console.log(angular.equals($injector.get('$injector'),$injector));//true
console.log(angular.equals($injector.invoke(function($injector) {return $injector;}),$injector));//true
//inferred
// $injector.invoke(function(serviceA){});
app.controller("myCtrl1", function($scope,hello1,hello2){
$scope.hello = function(){
hello1.hello();
hello2.hello();
}
});
//annotated
// function explicit(serviceA) {};
// explicit.$inject = ['serviceA'];
// $injector.invoke(explicit);
var myCtrl2 = function($scope,hello1,hello2){
$scope.hello = function(){
hello1.hello();
hello2.hello();
}
}
myCtrl2.$injector = ['hello1','hello2'];
app.controller("myCtrl2", myCtrl2);
//inline
app.controller("myCtrl3",['$scope','hello1','hello2',function($scope,hello1,hello2){
// app.controller("myCtrl3",['$scope','hello1','hello2',function(a,b,c){
// a.hello = function(){
// b.hello();
// c.hello();
// }
$scope.hello = function(){
hello1.hello();
hello2.hello();
}
}]);
console.log($injector.annotate(myCtrl2));//["$scope","hello1","hello2"]
</script>
</body>
</html>
AngularJS API之$injector ---- 依赖注入的更多相关文章
- AngularJS学习笔记之依赖注入
最近在看AngularJS权威指南,由于各种各样的原因(主要是因为我没有money,好讨厌的有木有......),于是我选择了网上下载电子版的(因为它不要钱,哈哈...),字体也蛮清晰的,总体效果还不 ...
- ASP.NET Web API中的依赖注入
什么是依赖注入 依赖,就是一个对象需要的另一个对象,比如说,这是我们通常定义的一个用来处理数据访问的存储,让我们用一个例子来解释,首先,定义一个领域模型如下: namespace Pattern.DI ...
- Magento2 API 服务合同设计模式 依赖注入 介绍
公共接口和API 什么是公共界面? 一个公共接口是一组代码,第三方开发者可以调用,实现或构建一个 插件 .Magento保证在没有重大版本更改的情况下,此代码在后续版本中不会更改. 模块的公共接口 标 ...
- AngularJS——第7章 依赖注入
第7章 依赖注入 AngularJS采用模块化的方式组织代码,将一些通用逻辑封装成一个对象或函数,实现最大程度的复用,这导致了使用者和被使用者之间存在依赖关系. 所谓依赖注入是指在运行时自动查找依赖关 ...
- angularJs的作用域和依赖注入
一.angularJs的作用域 &scope这是局部作用域,先在局部作用域中找,如果没有就在全局作用域中找 &rootScope这是全局作用域 <!DOCTYPE HTML&g ...
- angularjs(显示和隐身) 依赖注入
1.angularjs 隐身参数注入control: 1.control名称 , 2.function,在function内部直接传递参数和方法. var myapp=angular.model(&q ...
- 使用Autofac在ASP.NET Web API上实现依赖注入
在ASP.NET Web API里使用Autofac 1.通过NuGet安装Autofac.WebApi(当时安装的是Autofac 3.1.0) PM > Install-Package Au ...
- 【半小时大话.net依赖注入】（下）详解AutoFac+实战Mvc、Api以及.NET Core的依赖注入
系列目录 上|理论基础+实战控制台程序实现AutoFac注入 下|详解AutoFac+实战Mvc.Api以及.NET Core的依赖注入 前言 本来计划是五篇文章的,每章发个半小时随便翻翻就能懂,但是 ...
- 依赖注入——angular
在Angular中创建一个对象时,需要依赖另一个对象,这是代码层的一种依赖关系,当这种依赖被声明后,Angular通过injector注入器将所依赖的对象进行注入操作. 一.依赖注入的原理 看下面的示 ...
随机推荐
- 自动ftp上传文件脚本
方法一: echo "open 21.244.88.129 user glxtftp glbzuser bin prompt off cd /glxt/DBINFO lcd /tmp put ...
- CentOS随笔 不断添加
一.设置IP (1)临时IP ifconfig eth0 192.168.120.16 (2)永久IP vi /etc/sysconfig/network-scripts/ifcfg-eth0 ...
- 文档ID：某某 模板文件不存在，无法解析文档！
如果是生成栏目列表时出现这样的问题]: 1.可以修改include/arc.listview.class.php这个文件. 2.复制代码 echo "模板文件不存在,无法解析文档 ...
- 了解vmware tools
了解vmware tools vmware tools是虚拟机VMware Workstation自带的一款工具,它的作用就是使用户可以从物理主机直接往虚拟机里面拖文件.如果不安装它,我们是无法进行虚 ...
- （转）名称和本质 by王珢
名称和本质 by 王垠 我很喜欢 Richard Feynman 写的 <What Do You Care What Other People Think>.在最开头 Feynman 讲到 ...
- Python操作Mysql数据库时SQL语句的格式问题
一.概述 近日使用Python对Mysql数据库进行操作,遇到SQL语句死活出问题的情况.由于最初没有将异常打印出来,一直不知道原因.随后,将异常打印出来之后,通过异常信息,对代码进行修改.最终,成功 ...
- eclipse导入项目出现叹号处理方法：
1.选中该项目名称,单击右键 2.点击Properties 3.选中Java Build Path 4. 5. 6. 7.出现红叉的解决办法 8. 9. 10. 11. 12. 按照以上步骤操作就可以 ...
- 2016NOIP总结
从暑假开始学OI到现在,也已经过了4个月.说实话真是快啊...感觉没学什么东西就要去比赛了.怎么说呢,感觉自己真的是个菜鸡啊为什么就要去比赛呢.当初来到这里,是凭着兴趣来的,第一天能打那么多道题(19 ...
- touchstart、touchmove、touchend 实现移动端上的触屏拖拽
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Python 的简单图形界面编程【草】
可用方案 Tkinter python官方附带,方便,但听说存在乱码问题 wxPython 更成熟一些,但需要额外安装(大约50M) pyQt 授权不够宽松 最短代码 Tkinter 待补充 wxPy ...