如何处理Angular-UI-Router resolve中未实现的承诺?



假设我设置了一个angular ui路由器路由。当我改变到那个状态时,我告诉Angular我希望它先解析一个工厂调用,然后再加载视图。但是当api调用为空时会发生什么呢?我想通知用户没有找到结果,并保持在我的原始状态。不能转换到没有数据要显示的另一个视图。实现这一目标的最佳方式是什么?

路线(到目前为止,当我知道会有返回时,它按预期工作)

'use strict';
angular.module('testApp')
.config(function ($stateProvider) {
    $stateProvider
        .state('spinnerTest', {
            url: '/spinner_test',
            templateUrl: 'app/spinnerTest/spinnerTest.html',
            controller: 'SpinnerTestCtrl',
            resolve: {
                names: function(NamesService){
                    //What happens if I return an empty array []?
                    //How do I return to the previous state?
                    NamesService.getNames();
                }
            }
        });
  });

如果数组为空,可以在resolve中拒绝promise:

resolve: {
     names: function(NamesService) {
         return NamesService.getNames().then(function(names) {
             return names.length == 0 ? $q.reject('no names') : names;
         });
     }
 }

这是一个横切问题,它可能不是Name服务所独有的,您正在使用的其他服务也是如此。

由于您没有将代码发布到名称服务(NameService服务是多余的),我将假设它使用$http或$resource服务。然后,你可以使用$httpInterceptor来触发向用户显示一条消息:"当前选择不可用"。

如果您愿意,可以在解析中调用$state.go

'use strict';
angular.module('testApp')
.config(function ($stateProvider) {
    $stateProvider
        .state('spinnerTest', {
            url: '/spinner_test',
            templateUrl: 'app/spinnerTest/spinnerTest.html',
            controller: 'SpinnerTestCtrl',
            resolve: {
                names: function(NamesService, $state){
                    //What happens if I return an empty array []?
                    //How do I return to the previous state?
                    return NamesService.getNames().then(function(names){
                      if (!names.length) {
                        return $state.go('otherState');
                      }
                      return names;
                    });
                }
            }
        });
  });

最新更新