Angular - 具有不同模板的相同Url（UI路由器）

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

我真的很想解决这个问题，同时保持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')或类似的东西。

来源

2016-01-23 Andrew

发生了什么是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 
    } 
});

来源

2016-01-23 13:54:57 officert

所以基本上每当data.auth为false时，我应该在另一个承诺中包装ajax调用。有没有办法做到“全球”（我的猜测是否定）？ – Andrew

我编辑了上面的代码以删除“Deferred Antipattern”。 https://github.com/petkaantonov/bluebird/wiki/Promise-anti-patterns。 –

我通常会检查被捕获错误的返回值，例如，如果服务器使用HTTP 401进行响应，它只会返回null。我创建了一个名为'nullWhen'的帮助函数，将其传递给catch块。如果响应代码与401匹配，则返回null，否则承诺将像往常一样被拒绝。这样可以像往常一样处理其他错误代码，如“500服务器错误”。 –

Angular - 具有不同模板的相同Url（UI路由器）

回答

相关问题