router resolve factory undefined
I've followed the examples on the UI-Router wiki and the sample here: https://scotch.io/tutorials/angular-routing-using-ui-router but the resolved factory is undefined when it is injected into the controller. Any help would be greatly appreciated.
app var app = angular.module('toa', ['ngResource', 'ui.bootstrap', 'ui.router']);
app.config(function($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('/');
$stateProvider.state('home', {
url: '/',
views: {
'' : {
templateUrl: 'app/partials/home-partial.html'
},
'sidebar@home': {
templateUrl: 'loginMenu.html',
controller: 'loginController'
},
'content@home': {
templateUrl: 'app/views/home.html',
controller: 'homeController'
}
}
}).state('register', {
url: '/register',
views: {
'': { templateUrl: 'app/partials/register-partial.html' },
'content@register': {
resolve: {
registerService: 'registerService'
},
templateUrl: 'app/views/registerView.html',
controller: 'regController'
}
}
});
});
controller
app.controller('regController', ['$scope', '$location', '$resource', '$http', function($scope, $route, $routeParams, $location, $resource, $http, registerService){
// Controller code is here console.log(registerService) prints undefined
}
service
app.factory('registerService', ['$http', function($http){
return {
registerPlayer : function(playerName, playerPassword, playerEmail, playerGender) {
var newPlayer = {
...
};
$http.post('...', newPlayer).
success(function(data, status, headers, config) {
console.log(data);
console.log(status);
}).
error(function(data, status, headers, config) {
console.log(data);
console.log(status);
});
},
checkEmail : function(emailIn) {
var data = { email : emailIn };
return $http.post('...', data).
then(function(data) {
return data;
});
},
checkUsername : function(usernameIn) {
var data = { username : usernameIn };
return $http.post('...', data).
then(function(data) {
return data;
});
}
};
}]);
First of all, you forgot to declare registerService after $http in array notation of the controller definition.
If you want to inject something using resolve block in route configuration then you need to provide a function returning somthing, like Promise, or just a value. In your case try this:
resolve: {
registerService: function(registerService) {
return registerService;
}
},
However note, that in your case you can simply inject service directly to controller, as you don't need resolve it here:
app.controller('regController', ['$scope', '$location', '$resource', '$http', 'registerService', function($scope, $route, $routeParams, $location, $resource, $http, registerService) {
// Controller code is here console.log(registerService) prints undefined
}
resolve must be dict with functions, not a strings.
Change registerService: 'registerService' to some like this:
registerService: function (){
//here goes your resolve function.
}
There is no point in resolving a service you can already inject. I think there is a conflict between the name of the service declared at your module level, and the name of the resolved-dependency, and so angular is lost.
Resolve would be interesting if you'd want to registerUser or checkEmail before entering your controller.
I suggest you remove the resolve part, and then be sure to include the 'registerService' string before your function declaration.
链接地址: http://www.djcxy.com/p/13636.html下一篇: 路由器解析工厂未定义