使用控制器$ routeProvider解决登录 [英] Resolve login in $routeProvider using controller
问题描述
我试图限制用户到接入/主题
视图和 /问题
视图。我主页上的登录表单。我HomeCtrl具有以下登录功能:
I'm trying to restrict a user's access to a /topics
view and a /question
view. I have a login form on the home page. My HomeCtrl has the following login function:
$scope.doLogin = function() {
var user = {
username: $scope.username,
password: $scope.password
}
$http.post('data/user/users.json',
user
).success(function(data, status, headers, config) {
userService.isAuthenticated = true;
userService.username = data.username;
userService.password = data.password;
$location.path('/topics');
console.log('Yay! You logged in.')
}).error(function(data, status, headers, config) {
userService.isAuthenticated = false;
userService.username = '';
userService.password = '';
$scope.errorMessage = 'Failed to log in. Please check username and password.'
});
}
和我有一个工厂设置处理数据的当前状态:
And I have a factory set up to handle the current state of the data:
angular.module('myApp.userService', []).
factory('userService', function() {
var credentials = {
username: '',
password: '',
isAuthenticated: false
};
return credentials;
});
这是我的$ routeProvider:
And this is my $routeProvider:
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/', {
templateUrl: 'partials/home.html',
controller: 'HomeCtrl'
}).
when('/topics', {
templateUrl: 'partials/topics.html',
controller: 'TopicCtrl',
//resolve: isAuthenticated
}).
when('/question', {
templateUrl: 'partials/question.html',
controller: 'QuestionCtrl',
//resolve: isAuthenticated
}).
when('/terms', {
templateUrl: 'partials/terms.html',
controller: 'TermsCtrl'
}).
otherwise({
redirectTo: '/'
});
}]);
我试过设置类似下面的决心:
I've tried setting up a resolve like the following:
resolve: {
doLogin: HomeCtrl.doLogin
}
但是,返回以下错误:
But that returns the following error:
未能实例化模块对myApp由于:的ReferenceError:HomeCtrl是
没有定义的
在http://本地主机/ 2014年2月10日/应用/ JS / app.js:33:18
在Object.d [如调用]
Failed to instantiate module myApp due to: ReferenceError: HomeCtrl is not defined at http:// localhost/2014-02-10/app/js/app.js:33:18 at Object.d [as invoke]
任何帮助是极大AP preciated - 我一直在找这个整天和它的驾驶我疯了。
Any help is greatly appreciated - I've been looking at this all day and it's driving me mad.
推荐答案
忽略错误,这不会是解决这个问题的正确道路,因为你不能公开的HomeController如你所想,而不是与每一个依赖(如$范围)设置正确。
Ignoring the error, this would not be a correct way to solve this problem as you cannot expose HomeController as you are thinking and not with every dependency (like $scope) setup correctly.
您可以尝试捕捉$ locationChangeStart,在某些控制器在 NG-视图之外定义
或运行
阻止,限制登录用户
You can try to capture $locationChangeStart, in some controller that is defined outside the ng-view
or use the run
block to restrict to login user
app.run(function($location, $rootScope, $route, userService) {
$rootScope.$on('$locationChangeStart', function(evt, next, current) {
var nextPath = $location.path(),
nextRoute = $route.routes[nextPath];
if (nextRoute && nextRoute.auth && !loggedIn) {
$location.path("/home");
}
});
});
另外的路线应该被定义为
Also the routes should be be defined as
when('/topics', {
templateUrl: 'partials/topics.html',
controller: 'TopicCtrl',
auth: true
})
请参阅此<一个href=\"http://stackoverflow.com/questions/20718945/angularjs-authentication-issue-with-query-parameter\">SO后和 plunkr 得到一个想法。
See this SO post and the plunkr to get a idea.
这篇关于使用控制器$ routeProvider解决登录的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!