在config()模块中注入依赖项 – AngularJS
目前在app.js我有以下路线:
var gm = angular.module('gm', ['gm.services','gm.directives','gm.filters','gm.controllers','ngSanitize']); gm.config(['$routeProvider', 'Path', function($routeProvider, Path) { $routeProvider.when('/login', { templateUrl: Path.view('application/authentication/login.html'), controller: 'authController' }); $routeProvider.when('/dashboard', { templateUrl: Path.view('application/dashboard/index.html'), controller: 'dashboardController' }); $routeProvider.otherwise({ redirectTo: '/login' }); }]);
我试图在jectpath依赖关系,你可以看到。 虽然我得到一个错误,说它不能find这个提供者。 我认为这是因为configuration模块provicers是先执行任何事情之前。 下面是我在services.js中的path提供者定义
gm.factory("Path", function() { return { view: function(path) { return 'app/views/' + path; }, css: function(path) { return 'app/views/' + path; }, font: function(path) { return 'app/views/' + path; }, img: function(path) { return 'app/views/' + path; }, js: function(path) { return 'app/views/' + path; }, vendor: function(path) { return 'app/views/' + path; }, base: function(path) { return '/' + path; } } });
我怎么能注入这个提供程序到configuration模块?
在.config
你只能使用提供者(例如$routeProvider
)。 在.run
你只能使用服务的实例(例如$route
)。 你有一个工厂,而不是一个提供者。 用这三种创build方法来看这个片段:服务,工厂和提供者他们也在angular docs中提到了这个https://docs.angularjs.org/guide/services
- angular.config只接受提供者
- 每个服务,工厂等都是Provider的实例
因此,要在config中注入一个服务,只需要通过在其名称中添加“Provider”来调用服务的提供者。
angular.module('myApp') .service('FooService', function(){ //...etc }) .config(function(FooServiceProvider){ //...etc });
根据angularjs Provider 文档
…如果你定义一个Factory配方,一个空的Providertypes的$ get方法将被设置为你的工厂函数。
所以如果你有一个工厂(或服务),例如:
.factory('myConfig', function(){ return { hello: function(msg){ console.log('hello ' + msg) } } })
在访问返回的对象之前,您首先需要使用$ get方法调用您的工厂:
.config(function(myConfigProvider){ myConfigProvider .$get() .hello('world'); });
你应该使用常量,因为这是除configuration提供程序之外你可以在configuration阶段注入的唯一东西。
angular.module("yourModule").constant("paths", { base: function(){ ... } });
这个讨论帮助我,当我试图找出同样的事情,基本上
$routeProvider.when('/', { templateUrl:'views/main.html', controller:'MainController', resolve: { recentPosts: ['$q', 'backendService', function($q, backendService){ var deferred = $q.defer(); backendService.getRecentPosts().then( function(data) { var result = data.result; deferred.resolve(result); }, function(error) { deferred.reject(error); } ); return deferred.promise; }] } })