即使服务返回 404，$http 承诺也会执行成功块答案

【问题标题】：$http promise executes success block even when service returns 404即使服务返回 404，$http 承诺也会执行成功块
【发布时间】：2017-12-29 15:19:04
【问题描述】：

我很困惑，或者可能不明白 Angular Promise 是如何工作的。我正在尝试为我的错误处理编写一些代码块，但我看到它总是在我的控制器中执行成功块。但是，我也在我的服务中编写了成功和错误块，因为我需要在我的响应中进行一些转换。我看到它在服务中执行错误块，这很好，但同样的承诺在我的控制器中执行成功块。

HTML

<div ng-app="myApp">
    <div ng-controller="MainController">
         <h1>{{data}}</h1>
    </div>
<div>

angular.module('services', []).service('myService', function($http) {
   this.getData = function() {
    return $http.get('test.json').then(function (response) {
        console.log(response);
        return response.data;
      },function(data) {
       console.log("Error block of service");
      });
   }
});


var app = angular.module('myApp', ['services']);

app.controller('MainController', ['$scope', 'myService', function ($scope, myService) {
    // Call the getData and set the response "data" in your scope.  
    myService.getData().then(function(myReponseData) {
        console.log("Success block of controller");
        $scope.data = myReponseData;
    },function(data) {
        console.log("Error block of controller");
        $scope.data = "Error " + data;
    });
}]);

我在小提琴中重现了同样的问题。看看JSFiddle

【问题讨论】：

标签： javascript angularjs angular-promise angular-http

【解决方案1】：

因为 Promise 就是这样设计的。

如果您返回 catch 块内的任何内容，则您返回的任何内容都将成为链中下一个链接的 success。

唯一的两种方法是：

在你的 catch 中重新抛出一个错误
在你的 catch 中返回一个被拒绝的 Promise

这是一个更简单的例子：

Promise.reject(5)
  .catch(x => x * 2)
  .catch(err => console.log("THIS NEVER FIRES"))
  .then(x => console.log("Value is: ", x));
  // => "Value is: 10"

Promise.reject(5)
  .catch(x => Promise.reject(x * 2))
  .then(x => console.log("THIS NEVER FIRES"))
  .catch(err => console.log("Error is:", err));
  // => "Error is: 10"

【讨论】：

【解决方案2】：

在拒绝处理程序中，重新抛出错误很重要。否则被拒绝的承诺将转换为成功的承诺：

angular.module('services', []).service('myService', function($http) {
   this.getData = function() {
    return $http.get('test.json').then(function (response) {
        console.log(response);
        return response.data;
      },function(errorResponse) {
        console.log("Error block of service");
        //IMPORTANT re-throw error 
        throw errorResponse;
      });
   }
});

有关详细信息，请参阅You're Missing the Point of Promises。

【讨论】：