Angular "Unkown Provider" - 如何在 routeProvider 配置中使用工厂?
Angular "Unkown Provider" - how to use a factory within routeProvider configuration?
在玩 Angular 的同时,我试图更好地理解如何使用工厂、服务、常量、路由和其他核心概念。所以我用 node、express、jade 和 angular.
构建了一个简单的演示应用程序
现在我想在 routeProvider 配置中使用一个值。我创建了一个常量,这很好用。为了使其在未来使用时更加灵活,我随后建立了一个工厂,但是失败了 "unknown provider"。这是Angular中实例化顺序的问题吗?为什么我不能将工厂注入 .config
部分?在我尝试使用服务而不是工厂进行相同操作之前,出现了相同的错误。希望我没有犯简单的拼写错误或语法错误,到目前为止我没有发现任何错误。
angular
.module('main', [
'ngRoute'
])
.constant('cApp', {
'defaultPath': '/home'
})
.factory('svcState', function(){
var appState;
function getState(){
return appState;
}
function init() {
appState='/home';
}
init();
return{
getState: getState
};
})
.config(function($routeProvider, svcState, cApp){
$routeProvider
.when('/home', {
templateUrl: "partials/home"
})
.when('/info', {
templateUrl: "partials/info"
})
.otherwise({
//redirectTo: cApp.defaultPath // this works fine
redirectTo: svcState.getState // this fails with "Error: [$injector:unpr] Unknown provider: svcState"
})
})
;
svcState
应该是提供者而不是服务。因为 service/factory 在配置阶段无法访问。您需要将 svcState
的实现更改为提供程序,以便它在 angular.
的配置块中可用
提供程序实施后,您可以在配置块中使用 svcStateProvider
注入该提供程序。
.config(function($routeProvider, svcStateProvider, cApp){
$routeProvider
.when('/home', {
templateUrl: "partials/home"
})
.when('/info', {
templateUrl: "partials/info"
})
.otherwise({
redirectTo: svcStateProvider.getState() //<--change herer
})
})
查看 this answer 以了解有关提供商的更多信息
这是我更改的内容:
angular
.module('main', [
'ngRoute'
])
.provider('appState', function(){
var appState;
this.setState = function(newState) {
appState = newState;
};
this.getState = function() {
return appState;
};
this.$get = function() {
return appState;
};
function init() {appState='/home';}
init();
})
.config(function($routeProvider, appStateProvider){
$routeProvider
.when('/home', {
templateUrl: "partials/home"
})
.when('/info', {
templateUrl: "partials/info"
})
.otherwise({
redirectTo: appStateProvider.getState()
})
})
;
在玩 Angular 的同时,我试图更好地理解如何使用工厂、服务、常量、路由和其他核心概念。所以我用 node、express、jade 和 angular.
构建了一个简单的演示应用程序现在我想在 routeProvider 配置中使用一个值。我创建了一个常量,这很好用。为了使其在未来使用时更加灵活,我随后建立了一个工厂,但是失败了 "unknown provider"。这是Angular中实例化顺序的问题吗?为什么我不能将工厂注入 .config
部分?在我尝试使用服务而不是工厂进行相同操作之前,出现了相同的错误。希望我没有犯简单的拼写错误或语法错误,到目前为止我没有发现任何错误。
angular
.module('main', [
'ngRoute'
])
.constant('cApp', {
'defaultPath': '/home'
})
.factory('svcState', function(){
var appState;
function getState(){
return appState;
}
function init() {
appState='/home';
}
init();
return{
getState: getState
};
})
.config(function($routeProvider, svcState, cApp){
$routeProvider
.when('/home', {
templateUrl: "partials/home"
})
.when('/info', {
templateUrl: "partials/info"
})
.otherwise({
//redirectTo: cApp.defaultPath // this works fine
redirectTo: svcState.getState // this fails with "Error: [$injector:unpr] Unknown provider: svcState"
})
})
;
svcState
应该是提供者而不是服务。因为 service/factory 在配置阶段无法访问。您需要将 svcState
的实现更改为提供程序,以便它在 angular.
提供程序实施后,您可以在配置块中使用 svcStateProvider
注入该提供程序。
.config(function($routeProvider, svcStateProvider, cApp){
$routeProvider
.when('/home', {
templateUrl: "partials/home"
})
.when('/info', {
templateUrl: "partials/info"
})
.otherwise({
redirectTo: svcStateProvider.getState() //<--change herer
})
})
查看 this answer 以了解有关提供商的更多信息
这是我更改的内容:
angular
.module('main', [
'ngRoute'
])
.provider('appState', function(){
var appState;
this.setState = function(newState) {
appState = newState;
};
this.getState = function() {
return appState;
};
this.$get = function() {
return appState;
};
function init() {appState='/home';}
init();
})
.config(function($routeProvider, appStateProvider){
$routeProvider
.when('/home', {
templateUrl: "partials/home"
})
.when('/info', {
templateUrl: "partials/info"
})
.otherwise({
redirectTo: appStateProvider.getState()
})
})
;