Получить статус ответа HTTP-ответа на AngularJS

Question

Я следую онлайн-курсу в AngularJS, и я на первых шагах изучаю его.

Я пытаюсь вызвать API после отправки формы и на основе ответа API, показать и скрыть некоторые данные.

Сначала я пытаюсь проверить ответ на состояние, если он возвращает 500 ошибок для недействительного вызова API. Однако, похоже, я не могу этого сделать.

Часть моего служебного файла:

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 не может быть проверен.

Version 1.5.8 на 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 функции возвращает обещание, не разрешенное значение. Так что просто используйте «затем» на нем, чтобы проверить разрешенное значение.

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

Надеюсь, что это поможет. Кстати, этот код может ввести в заблуждение, так как «500» может быть ответчиком «response.data». Следовательно, лучше не ставить обратный вызов «error» и позволить вызывающей службе обрабатывать ошибки самостоятельно. , например.

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