Erhalten $ HTTP-Antwort Fehlerstatus auf AngularJS

Question

Ich folge einem Online-Kurs in AngularJS und ich bin auf den ersten Schritten des Lernens.

Ich versuche, eine API nach einer Formularübergabe aufzurufen und basierend auf der API-Antwort einige Daten ein- und auszublenden.

Was ich versuche zuerst zu tun, ist die Statusantwort zu überprüfen, falls sie 500 Fehler für einen ungültigen API-Aufruf zurückgibt. Es scheint jedoch, ich kann es nicht tun.

Teil meiner Service-Datei:

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; 
    }) 
    }; 

Und auf meinem Controller:

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; 
    } 
    }; 
} 

Wenn ich habe keine Fehler auf dem $ http Aufruf, alles funktioniert, wie es sollte. Mit dem Fehler 500 scheint es jedoch nicht. Ich habe versucht, die signupCtrl.response auf meinem Controller zu loggen und die value: 500 ist da. Aber das kann nicht validiert werden.

Version 1.5.8 auf AngularJS

Answer 1

Call a-Service-Funktion mit .then() Verkettungsverfahren.

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 service wird nicht versprechen versprechen. Es wird eine Rückruffunktion entweder success oder error zurückgeben. so sollten Sie da so aussehen:

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; 
     } 

so in diesem Fall werden lösen Sie das Ergebnis, wenn es Erfolg. oder Sie werden den Status beheben, wenn es fehlgeschlagen ist.

Und in Ihrem Controller, sollten Sie Folgendes tun:

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

Ihre getMenuItem Funktionen gibt ein Versprechen, nicht der aufgelöste Wert. Verwenden Sie einfach "then", um den aufgelösten Wert zu überprüfen.

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

Hoffe, dass hilft. BTW, dieser Code kann verwirrend sein, da "500" eine "response.data" legit Antwort sein kann. Daher ist es besser, keinen "Fehler" Callback zu setzen und den rufenden Service Fehler selbst behandeln zu lassen. z.B.

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