Yac*_*gui 44 javascript dependency-injection angularjs
我仍然是Angularjs的首次亮相.我想在我的控制器中动态注入服务(我创建的)的依赖项.
但是,当我使用依赖项编写服务时,我收到此错误:
错误:未知提供者:$ windowProvider < - $ window < - base64
这是控制器的代码.
var base64 = angular.injector(['servicesModule']).get('base64');
console.log("base64", base64.encode("my text will be encoded"));
Run Code Online (Sandbox Code Playgroud)
此代码有效:
var servicesModule = angular.module('servicesModule', []);
servicesModule.factory('base64', function() {
return {
name: 'base64',
readonly: false,
encode: function(input) {
return window.btoa(input);
},
decode: function(input) {
return window.atob(input);
}
};
});
Run Code Online (Sandbox Code Playgroud)
此代码不起作用:
var extModule = angular.module('ext', []);
extModule.factory('base64', ['$window', function($window) {
return {
name: 'base64',
readonly: false,
encode: function(input) {
return $window.btoa(input);
},
decode: function(input) {
return $window.atob(input);
}
};
}]);
Run Code Online (Sandbox Code Playgroud)
另一个问题是当服务与控制器在同一模块中时.如果模块有依赖项,我不工作(我的模块配置中有$ routeProvider依赖):
错误:未知提供者:来自mainModule的$ routeProvider
var mainModule = angular.module('main', [],
function($routeProvider, $locationProvider) {
//Some routing code
}
);
Run Code Online (Sandbox Code Playgroud)
JS小提琴
具有依赖关系的相同模块(控制器+服务):http://jsfiddle.net/yrezgui/YedT2/
具有依赖关系的不同模块:http://jsfiddle.net/yrezgui/YedT2/4/
不依赖的不同模块:http://jsfiddle.net/yrezgui/YedT2/5/
Mar*_*cok 62
不要调用angular.injector() - 这会创建一个新的注入器.相反,将已创建的$injector注入到控制器中并使用它:
所以代替:
var algoController = function($scope) {
$scope.base64 = angular.injector(['main']).get('base64');
};
Run Code Online (Sandbox Code Playgroud)
做这个:
var algoController = function($scope, $injector) {
$scope.base64 = $injector.get('base64');
};
Run Code Online (Sandbox Code Playgroud)
但是大多数时候你应该直接注入你的服务,而不是动态注入你的服务,如下所示:
var algoController = function($scope, base64) {
$scope.base64 = base64;
};
Run Code Online (Sandbox Code Playgroud)