在Angular UI路由器中未解决数据时出错处理

Question

我正在使用angular-ui-router的resolve在移动状态之前从服务器获取数据。我想通知用户请求是否失败。我有服务会响应请求失败的错误。我的问题是如何检测UI-resolve中的故障并触发某些Modal服务，如弹出。

我已经在网上阅读了一些相关帖子，但我仍然困惑如何让它发生。先谢谢了！

配置和服务：

angular.module('myApp',['ui.router', 'ngAnimate', 'ui.bootstrap']) 
    .config(function ($stateProvider, $locationProvider) { 
     $locationProvider.html5Mode(true); 
     $stateProvider 
      .state('customer', { 
       url: '/customer', 
       templateUrl: '/customer.html', 
       controller: 'CustomerCtrl', 
       resolve: { 
        /* 
        * How to inject CustomerService here 
        * How to catch the server error 
        * How to trigger a popup 
        */ 
        data: cusomter_data 
       } 
      }); 

    }) 
    .service('CustomerService', function($http, $q) { 
     return ({ 
      getGeneral: getGeneral 
     }); 

     function getGeneral(customer_id) { 
      var request = $http({ 
       method: "get", 
        url: '/customer', 
        params: { 
         customer_id: customer_id 
        } 
      }); 
      return (request.then(handleSuccess, handleError)); 
     } 

     function handleError (response){ 
      if (!angular.isObject(response.data) || !response.data.message) { 
       return($q.reject("Failed to retrieve customer information.")); 
      } 
      return($q.reject(response.data.message)); 
     } 

     function handleSuccess(response) { 
      return (response.data); 
     } 
    }); 

Answer 1

经过一番研究，我通过创建errorModal服务，并注入它来解决找到了一个解决方案。这是我的解决方案。

$stateProvider 
    .state('customer', { 
     url: '/customer', 
     templateUrl: '/customer.html', 
     controller: 'CustomerCtrl', 
     resolve: { 
      data: function(CustomerService, SelectedCustomerService, errorModalService) { 
       var shared = SelectedCustomerService; 
       return CustomerService.getData(shared.customerid).then(
        function (data) { return data; }, 
        function(error) { 
         var modalOptions = { 
          closeButtonText: 'Close', 
          headerText: 'Customer Error', 
          bodyText: error 
         }; 
         errorModalService.showModal({}, modalOptions); 
        } 
       ); 
      } 
     } 
    });