インターセプター：再試行でタイムアウトモーダル

Question

私は角度のインターセプターを書こうとしています（私はイオン性です）。 目標は、タイムアウトの要求を傍受して（それらの状態が-1であると仮定して）、モーダルを表示し、接続が完了するまで再試行することです。 インターセプタが期待どおりに動作しているように見えますが、接続が復元されても何も起こりません。私はreturn $http(rejection.config);を$timeoutの内部に持つのは間違いです。

services.config(['$httpProvider', function($httpProvider) { 
    $httpProvider.interceptors.push(function($injector, $q, $timeout) { 
    return { 
     // we use the incerceptor to assign a timeout property to every http request 
     request: function (config) { 
      config.timeout = 5000; 
      return config; 
     }, 
     responseError: function(rejection) { 
     // We assume timeouts have status=-1 
     var $http = $injector.get("$http"); 
     var $rootScope = $injector.get("$rootScope"); 
     // duration defines how long the modal screen will be open (in seconds) 
     var duration = 5; 
     var showModalAndRetry = function(rejection) { 
      $timeout(angular.noop, 1000).then(function() { 
      $rootScope.$broadcast("app.somethingWentWrong"); 
      $timeout(angular.noop, duration * 1000).then(function() { 
       $rootScope.$broadcast("app.closeSomethingWentWrong"); 
       console.log("resending"); 
       console.log(rejection); 
       return $http(rejection.config); 
      }); 
      }); 
     }; 
     switch(rejection.status) { 
      case -1: 
      return showModalAndRetry(rejection); 
     } 
     return $q.reject(rejection); 
     } 
    } 
    }); 
}]); 

Answer 1

私は約束の.then方法を解決する新しい約束を返す$タイムアウト内でreturn $http(rejection.config);を持っている

//ERRONEOUS 
    var showModalAndRetry = function(rejection) { 
     $timeout(angular.noop, 1000).then(function() { 
     $rootScope.$broadcast("app.somethingWentWrong"); 
     $timeout(angular.noop, duration * 1000).then(function() { 
      $rootScope.$broadcast("app.closeSomethingWentWrong"); 
      console.log("resending"); 
      console.log(rejection); 
      return $http(rejection.config); 
     }); 
     }); 
    }; 

正しくない怖いですどのように.thenメソッドに与えられた関数に返されます。その新しい約束を親の機能に戻すことが重要です。それ以外の場合、親関数はundefinedの値を返します。この場合

//INSTEAD 
function showModalAndRetry (rejection) { 
    //vvvv RETURN timeout promise 
    return $timeout(angular.noop, 1000).then(function() { 
    $rootScope.$broadcast("app.somethingWentWrong"); 
    //vvvv RETURN timeout promise 
    return $timeout(angular.noop, duration * 1000).then(function() { 
     $rootScope.$broadcast("app.closeSomethingWentWrong"); 
     console.log(rejection); 
     return $http(rejection.config); 
    }); 
    }); 
}; 

別$timeout約束内にネスト$timeout約束があります。ネスティングの各レベルにはreturnステートメントが必要です。

DEMO on PLNKR.

---

避けるために "破滅のピラミッド" ネスティングは、約束を連鎖させることができます：詳細な回答のため

function showModalAndRetry (rejection) { 
    //vvvv RETURN timeout promise 
    return $timeout(null, 1000) 
    .then(function() { 
     $rootScope.$broadcast("app.somethingWentWrong"); 
     //vvvv RETURN timeout promise 
     return $timeout(null, duration * 1000); 
    }).then(function() { 
     $rootScope.$broadcast("app.closeSomethingWentWrong"); 
     console.log(rejection); 
     //vvvv RETURN httpPromise 
     return $http(rejection.config); 
    }); 
};