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>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试？测试工程师会被淘汰吗？
2014-11-05 【设计模式】—— 解释器模式Interpret
2013-11-05 cuda中的二分查找
2012-11-05 DoModal 函数的用法