从状态提供者的解析方法改变角度app的状态

Question

我在角度应用程序中使用ui-router.目前我有两条路线/登录和/用户.最初它在用户点击登录按钮时显示/登录,我发送ajax请求并获取用户ID.我将用户ID存储在localstorage中并将状态更改为/ user.

现在,我想要的是,如果用户没有登录,并且用户将地址栏更改为/ user,则不会更改视图,而是将地址栏网址再次更改为/ signin.

我试着使用解决方案,但它不起作用.我的代码是: -

module.exports = function($stateProvider, $injector) {
$stateProvider
.state('signin', {
    url: '/signin',
    template: require('../templates/signin.html'),
    controller: 'LoginController'
})
.state('user', {
    url: '/user/:id',
    template: require('../templates/user.html'),
    resolve:{
        checkLogin:  function(){
             var $state = $injector.get('$state');
            console.log("in resolve");
             if (! window.localStorage.getItem('user-id')) {
                 console.log("in if")
                  $state.go('signin');
             }
        }
    },
    controller: 'UserController'
 })

}

请帮我解决这个问题.

Answer 1

我不认为允许在州过渡期间改变状态.

因此,解决它的方法是将checkLoginresolve参数(我在下面更改为userId)作为一个返回值或promise的函数(在这种情况下,如果你不能得到,则拒绝的promise user-id).

然后,您需要处理此问题$rootScope.$on('$stateChangeError')并检查错误代码.

resolve: {
   userId: function ($q, $window) {
      var userId = $window.localStorage.getItem('user-id');
      if (!userId) {
         return $q.reject("signin")
      }

      return userId;
   }
}

并在$stateChangeError处理程序中重定向:

$rootScope.$on('$stateChangeError', function (event, toState, toParams, fromState, fromParams, error) {
     if (error === "signin") {
        $state.go("signin");
     }
});