一般情况下,获取依赖可以通过3种方式完成,分别为创建依赖、全局查找依赖、依赖注入。
(1)使用new操作符创建依赖
function AppLog() {
this.startInfo = function() {
console.info("====应用开始启动====");
}
}
function App() {
this.start = function() {
var log = new AppLog();
log.startInfo();
}
}var app = new App();
app.start();
(2)通过全局变量查找依赖
function AppLog() {
this.startInfo = function() {
console.info("====应用开始启动====");
}
}
var log = new AppLog();
function App() {
this.start = function() {
log.startInfo();
}
}
var app = new App();
app.start();
(3)依赖需要时被注入
var appMod = angular.module("appMod", []);
function AppLog() {
this.startInfo = function() {
console.info("");
}
}
function App(appLog) {
this.start = function() {
appLog.startInfo();
}
}
appMod.service("appLog", AppLog);
appMod.service("app", App);
appMod.controller("MainController", function(app) {
app.start();
}
1 JavaScript依赖注入实现
2 AngularJS中的依赖注入
AngularJS提供了三种依赖注入方式:
(1)数组标注方式
var appMod = angular.module("appMod", []);
appMod.controller("MainController", ["$scope", "$http", function($scope, $http) {
}]);
第二数组类型的参数声明了$scope和$http这两个依赖,数组的最后一个参数为控制器的构造方法,需要注意的是,构造方法的参数列表与前面的数组元素是一一对应的。
(2)$inject属性注入依赖
var appMod = angular.module("app", []);
var MainController = function($scope, $http) {
}
MainController.$inject = ["$scope", "$http"];
appMod.controller("MainController", MainController);
(3)隐式声明依赖
var app = angular.module("app", []);
app.controller("MainController", function($scope, $http){
$scope.name = "";
}
该种声明方法需要注入器从方法的参数名推断所依赖的服务。
补充: ng-strict-di指令切换到严格的依赖注入模式。
3 $injector服务
$injector服务实际上就是一个IoC容器,当我们创建一个新的可注入类型,例如Service、Factory等,这些可注入类型就会注册到IoC容器中,AngularJS通过$injector服务对这些可注入类型进行集中管理,这也就意味着我们可以通过$injector服务获取到所有的可注入类型。