[英]Angular get route parameters from location change start
I have routes setup like so: 我有这样的路由设置:
app.config(function($routeProvider) {
$routeProvider
//login
.when("/", {
templateUrl : "framework/views/login.html",
controller : "LoginCtrl",
title: "Login",
authenticate: false
})
//dashboard
.when("/dashboard", {
templateUrl : "framework/views/dashboard.html",
controller : "DashboardCtrl",
title: "Dashboard",
authenticate: true
});
});
Now I want to redirect location changes if authenticate
is set to true
on the route but a session variable
is not true
. 现在,如果路由上的authenticate
设置为true
,但session variable
不是true
我想重定向位置更改。
For example: 例如:
$rootScope.$on("$locationChangeStart", function(event, newURL, oldURL){
if (toState.authenticate && $window.sessionStorage.isLoggedIn) {
$location.path("/");
}
});
This works if I use $routeChangeStart
instead, but then I see the next route briefly before it redirects. 如果我改用$routeChangeStart
,则此方法有效,但是在重定向之前,我会短暂地看到下一条路由。 Location change seems to stop that, but I can't work out how to access the route parameters (ie the authenticate parameter). 位置更改似乎阻止了这种情况,但是我无法解决如何访问路线参数(即authenticate参数)的问题。
How do I do this? 我该怎么做呢? Or is there a better way entirely? 还是完全有更好的方法?
you should use the resolve parameter within the .when(). 您应该在.when()中使用resolve参数。 This acts as a promise where you can set certain criteria that must be satisfied before the view is rendered. 这可以作为一种保证,您可以在其中设置呈现视图之前必须满足的某些条件。 You can find a good demo video here: https://egghead.io/lessons/angularjs-resolve 您可以在这里找到一个很好的演示视频: https : //egghead.io/lessons/angularjs-resolve
As I stated in the comment and on demand of Cooper I post an example: 正如我在评论中所述并应Cooper的要求,我举了一个例子:
angular.module('myApp',[])
.factory('httpInterceptor', ['$q', '$location',function ($q, $location) {
var canceller = $q.defer();
return {
'request': function(config) {
// promise that should abort the request when resolved.
config.timeout = canceller.promise;
return config;
},
'response': function(response) {
return response;
},
'responseError': function(rejection) {
if (rejection.status === 401) {
canceller.resolve('Unauthorized');
$location.url('/user/signin');
}
if (rejection.status === 403) {
canceller.resolve('Forbidden');
$location.url('/');
}
return $q.reject(rejection);
}
};
}
])
//Http Intercpetor to check auth failures for xhr requests
.config(['$httpProvider',function($httpProvider) {
$httpProvider.interceptors.push('httpInterceptor');
}])
.config(['$stateProvider',function($stateProvider) {
// states for users
$stateProvider
.state('users', {
abstract: true,
templateUrl: 'users/views/users.html',
resolve: {
issessionedin: function(Sessions){
return Sessions.isLoggedIn();
}
}
})
.state('users.account', {
url: '/user/account/:id',
templateUrl: 'users/views/account.html',
resolve: {
user: function(Users, $stateParams){
return Users.get($stateParams.id);
}
},
controller:'UserAccountController'
})
}])
.factory('Sessions', ['$http',
function($http) {
return{
isSessionedIn :function() {
$http.get('/api/v1/issessionedin');
},
isLoggedIn :function() {
$http.get('/api/v1/isloggedin');
},
hasAccess :function(permission) {
$http.get('/api/v1/hasaccess/'+permission);
}
};
}
]);
of course you need the code server side to return the http status code 当然,您需要代码服务器端返回http状态代码
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.