Question

我有一个场景，其中许多网址在登录和注销时都可以访问。我正在考虑拥有一个父状态，我可以处理必要的解析（如果登录时获取用户信息等），并且所有状态都是这个根状态的子状态。然后在模板中，我可以根据用户状态为ng-if元素执行操作。这一切都很好，除了一件事：当访问令牌无效时，API服务器发送401响应，导致状态不加载。

我真的想在保持HTTP响应的同时解决这个问题。基本示例：

根状态：

$stateProvider.state('base', {
        controller: 'BaseController',
        controllerAs: 'vm',
        template: '<ui-view layout="row" flex />',
        abstract: true,
        resolve: {
            me: function (userService) {
                return userService.me();
            }
        },
        data: {
            auth: false
        }
});

本州：

    $stateProvider.state('base.home', {
        controller: 'HomeController',
        controllerAs: 'vm',
        url: '/home',
        templateUrl: 'home/home.html',
        data: {
            auth: false
        }
    });

我想要做的是即使me解析为401仍然加载控制器/模板data.auth为false。否则我只会$state.go('login')或类似的东西。

Answer 1

正在发生的事情是UI-Router正在从您的Ajax呼叫中获得401响应，在这种情况下，它无法解决me，并且无法加载州。您需要将ajax调用包装在另一个Promise中，这样您就可以处理401，并仍然解析Promise，只需使用null解决它。

$stateProvider.state('base', {
  controller: 'BaseController',
  controllerAs: 'vm',
  template: '<ui-view layout="row" flex />',
  abstract: true,
  resolve: {
    me: ['userService', function (userService) {
      return userService.me().catch(function(error) {
          //user is not logged in, but eat the error so
          //the state still loads, just with user = null
          return null;
      });          
    }]
  },
  data: {
    auth: false
  }
});

Angular - 具有不同模板的相同URL（ui-router）

1 个答案: