AngularJSの$ http応答エラーステータスを取得

Question

私はAngularJSのオンラインコースに続き、私はそれを学ぶ最初のステップです。

フォームの送信後にAPIを呼び出そうとしていて、APIの応答に基づいてデータを表示および非表示にしています。

私が最初にしようとするのは、無効なAPI呼び出しに対して500のエラーを返す場合のステータス応答を確認することです。しかし、私はそれを行うことはできないようです。私のサービスファイルの

パート：

service.getMenuItem = function (shortName) { 

    return $http.get(ApiPath + '/menu_items/' + shortName + '.json') 
    .then(function successCallback(response) { 
     return response.data; 
    }, function errorCallback(response) { 
     return response.status; 
    }) 
    }; 

そして、私のコントローラ上の

：

SignupController.$inject = ['MenuService']; 
function SignupController(MenuService) { 
    var signupCtrl = this; 

    signupCtrl.submit = function() { 
    signupCtrl.response = MenuService.getMenuItem(signupCtrl.user.favouritedish); 
    if (signupCtrl.response == 500) { 
     signupCtrl.dishError = true; 
    } 
    }; 
} 

それが必要として、私は任意の$のHTTP呼び出しのエラー、すべての仕事を持っていない場合。しかし、500のエラーでは、そうではないようです。私はコントローラにsignupCtrl.responseを記録しようとしましたが、value: 500はそこにあります。しかし、ifを検証することはできません。

バージョン1.5.8 on AngularJS

Answer 1

.then（）連鎖メソッドを使用してサービス関数を呼び出します。

SignupController.$inject = ['MenuService']; 

    function SignupController(MenuService) { 
     var signupCtrl = this; 

     signupCtrl.submit = function() { 

     MenuService.getMenuItem(signupCtrl.user.favouritedish) 
      .then(function(result) { 
      console.log(result.data) 
      }, function(error) { 
      console.log(error.data) 
      }) 
     }; 
    } 

Answer 2

$httpサービスは約束を返しません。それはsuccessまたはerrorのいずれかのコールバック関数を返します。サービスは次のようになります。

function getMenuItem() { 

      var deferred = $q.defer(); 

      $http.get(serviceBase + '/api/itemId').success(function (result) { 
       deferred.resolve(result); 
      }).error(function (err) { 
       deferred.reject(err.status); 

      }); 
      return deferred.promise; 
     } 

この場合、成功した場合は結果を解決します。失敗した場合はステータスを解決します。

そして、あなたのコントローラでは、次の実行する必要があります。

SignupController.$inject = ['MenuService']; 
function SignupController(MenuService) { 
    var signupCtrl = this; 

    signupCtrl.submit = function() { 
    signupCtrl.response = MenuService.getMenuItem(signupCtrl.user.favouritedish).then(function(response){ 

    //to do if it success 
    }, function(errorStatus){ 
    signupCtrl.dishError = true; 
    // to do with the error status 
    }; 
} 

Answer 3

あなたgetMenuItem機能は約束ではなく、解決された値を返します。 解決済みの値を確認するには、「then」を使用してください。

MenuService.getMenuItem(signupCtrl.user.favouritedish).then(
    function(response) { 
     if (response === 500) { 
     signupCtrl.dishError = true; 
     } 
    } 
); 

希望します。 "500"は "response.data"の正当な応答かもしれないので、このコードは混乱するかもしれません。 したがって、「エラー」コールバックを入れずに、呼び出し元のサービスがエラーを処理するようにする方がよいでしょう。例：

MenuService.getMenuItem(signupCtrl.user.favouritedish).then(
     function(response) { 
      // Do something with response.data 
     } 
    ).catch(error) { 
     singupCtrl.dishError = true; 
    }