我在项目中使用 Angular 的 ui-router 和嵌套路由,当我使用链接(ui-sref)以 userId 作为一部分导航到用户的详细信息页面时,我遇到了这样的问题:一切都像魅力一样工作网址的。当我刷新页面时,状态参数丢失。
所以我看了一下 Angular 演示:http://angular-ui.github.io/ui-router/sample/#/contacts/1/item/b并且无法重现此行为,但是与我的应用程序相比,嵌套状态不是此演示的一部分。
$stateProvider
.state('base', {
abstract: true
})
.state('home', {
parent: 'base',
url: '/',
views: {
'content@': {
templateUrl: 'app/index/index.view.html',
controller: 'IndexController',
controllerAs: 'home'
}
}
})
.state('users', {
url: '/users',
parent: 'base',
abstract: true
})
.state('users.list', {
url: '/list',
views: {
'content@': {
templateUrl: 'app/users/users.list.html',
controller: 'UsersController',
controllerAs: 'users'
}
},
permissions: {
authorizedRoles: UserRoles.ALL_ROLES
}
})
.state('users.details', {
url: '/:userId/details',
views: {
'content@': {
templateUrl: 'app/users/user.details.html',
controller: 'UserDetailsController',
controllerAs: 'userDetails'
}
},
resolve: {
logSomeParams: ['$stateParams', '$state', function ($stateParams, $state) {
console.log($stateParams);
console.log(this);
console.log($state);
}]
}
})
刷新页面时,url 立即更改为 http://localhost:3000/#/users//details控制台输出(解析函数)显示参数丢失。
html5Mode (LocationProvider) 未启用。我已经找到了“解决方案”,例如如果页面刷新时缺少 userId,则重定向回列表,但我只是不敢相信没有更好的方法来解决此问题。
这就是我在概述中链接详细信息页面的方式(并且它正在工作):
<div class="panel-body" ui-sref="users.details({userId: user.siloUserId})">
最佳答案
正如预期的那样,我的问题与ui-router
无关。即使您刷新页面,URLMatcher
也会按预期工作(其他一切都会令人非常失望)。
但是,我有一个 $stateChangeStart
监听器,用于检查 SAML
身份验证 session (cookie) 是否仍然有效并等待结果。
function(event, toState, toParams, fromState, fromParams){
if(!authenticationService.isInitialized()) {
event.preventDefault();
authenticationService.getDeferred().then(() => {
$state.go(toState);
});
} else {
//check authorization
if ( authenticationService.protectedState(toState) && !authenticationService.isAuthorized(toState.permissions.authorizedRoles)) {
authenticationService.denyAccess();
event.preventDefault();
}
}
}
不知道这是怎么发生的,但我忘记将参数传递给 stateProvider
的 go
方法。所以我所要做的就是添加参数:
$state.go(toState, toParams);
关于angularjs - 使用 ui-router 刷新页面时 StateParams 为空,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34944076/