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注入器将所依赖的对象进行注入操作. 一.依赖注入的原理 看下面的示 ...
随机推荐
- js基础3
内置对象 内置对象就是JS提供的一套工具箱,我们通过内置可以很方便的进行一些操作. Math对象: Math.ceil() //向上取整,天花板 Math.floor() //向下取整,地板 Math ...
- SubVersion Ubuntu
UbuntuサーバにSubversionを入れる Linux, 開発ツール | Ubuntuサーバが無事に動いたので.続いてSubversionを入れてみる. こんな感じの環境を考える. Apa ...
- Find Peak Element
A peak element is an element that is greater than its neighbors. Given an input array where num[i] ≠ ...
- XNA游戏编程等
XNA游戏编程:http://shiba.hpe.sh.cn/jiaoyanzu/WULI/soft/xna.aspx?classId=4 表示没学过XNA,但感觉还是很不错的,给学XNA的童鞋们参考 ...
- 实用redis前需了解的5大事项
百万个键,每个值的长度是32-character,那么在使用6-character长度键名时,将会消耗大约96MB的空间,但是如果使用12-character长度的键名时,空间消耗则会提升至111MB ...
- 安装mysql
查看已安装的mysql,并删除它们 rpm -qa|grep -i mysql rpm -e --nodeps filename 如果重装mysql,查找安装mysql产生的文件,并删除它们 find ...
- [译]MVC网站教程（三）：动态布局和站点管理
目录 1. 介绍 2. 软件环境 3. 在运行示例代码之前(源代码 + 示例登陆帐号) 4. 自定义操作结果和控制器扩展 1) OpenFileResult 2) ImageR ...
- .net core中使用openssl的公钥私钥进行加解密
这篇博文分享的是 C#中使用OpenSSL的公钥加密/私钥解密 一文中的解决方法在 .net core 中的改进.之前的博文针对的是 .NET Framework ,加解密用的是 RSACryptoS ...
- EF联合查询，如何设置条件过滤从表数据
最近在使用EF进行联合查询过程中,遇到了一件不开心的事情. 已禁用懒加载 var post = await _repository.GetMyPostById(blogId, postId).AsNo ...
- Hadoop学习笔记—19.Flume框架学习
START:Flume是Cloudera提供的一个高可用的.高可靠的开源分布式海量日志收集系统,日志数据可以经过Flume流向需要存储终端目的地.这里的日志是一个统称,泛指文件.操作记录等许多数据. ...