如何在ui-router中重定向解析?

Edg*_*nez 40 angularjs angular-ui-router

我试图在ui-router解决方案内重定向,并想知道是否有办法在路由器解析器中重新路由.目前,这并不像人们想象的那样有效.

resolver(auth, $state){
   if(!auth.isLoggedIn()){
       $state.go('noLoggedInPath');
   }
}
Run Code Online (Sandbox Code Playgroud)

如何在旋转变压器中正确重定向?

我的临时黑客就是这个,但我对此并不满意.

resolver(auth, $state, $timeout){
   if(!auth.isLoggedIn()){
        $timeout(function () {

             $state.go('noLoggedInPath');
        }, 0);
   }
}
Run Code Online (Sandbox Code Playgroud)

bwe*_*t87 47

Yauheni的答案确实有效,但为了解决奇怪的超时问题,你可以拒绝承诺,并在$ stateChangeError事件中捕获它,并在那里进行重定向.像这样......

state('admin', {
  resolve: {
    auth: function(UserService, $q, permissionService) {
      var deferred = $q.defer();
      return UserService.load().then(function(user){
        if (permissionService.can(user, {goTo: state})) {
          return deferred.resolve({});
        } else {
          return deferred.reject({redirectTo: 'some_other_state'});
        }
      });
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

然后ui-router总是广播"stateChangeError",所以你可以做这样的事情.

$rootScope.$on('$stateChangeError', function(evt, to, toParams, from, fromParams, error) {
  if (error.redirectTo) {
    $state.go(error.redirectTo);
  } else {
    $state.go('error', {status: error.status})
  }
})
Run Code Online (Sandbox Code Playgroud)

  • 没有@Kunal.虽然这可能更"惯用",但它存在将路由逻辑分散到各处的问题.从实际的角度来看,情况更糟.想想可维护性. (10认同)
  • 这应该是正确的答案。`resolver`应该只用于解决/拒绝依赖。 (2认同)
  • @ bwest87如果错误处理程序依赖于您尝试访问的页面,该怎么办?这就是我所说的用例.在我正在研究的应用程序中导致分布式逻辑.这很糟糕,因为它是一个非常大的应用程序 (2认同)

Yau*_*nok 40

您可以从resolver函数返回一个承诺,该承诺将指示是否继续导航到州.如果您决定在其他地方导航 - 拒绝承诺并指定正确的状态:

resolver($q, $state, $timeout, auth) {
    var deferred = $q.defer();

    // $timeout is an example; it also can be an xhr request or any other async function
    $timeout(function() {
      if (!auth.isLoggedIn()) {
        // user is not logged, do not proceed
        // instead, go to a different page
        $state.go('noLoggedInPath');
        deferred.reject();
      } else {
        // everything is fine, proceed
        deferred.resolve();
      }
    });

    return deferred.promise;
}
Run Code Online (Sandbox Code Playgroud)

Plunkr 在这里.

UPD:更新了代码并添加了plunkr.看起来只有将它放在超时功能中才有效.

  • @EdgarMartinez好的,我玩了一下plunkr,并意识到重定向只有在它放在一些异步函数内才有效(超时是最简单的选项).请检查它是否适合您. (3认同)

Hik*_* G. 8

我用这个

   function Check($state, $q) {
        var deferred = $q.defer();
        if (condition) {
            deferred.resolve();
        }
        else {
            deferred.reject();
        }
        return deferred.promise.catch(function () { $state.go('path'); });
    }
Run Code Online (Sandbox Code Playgroud)