CODEWITHSUNDEEP
javascriptangularjs
Tech Kid
Tech Kid

Reputation: 577

AngularJS: how to get the error status of $http

Here is my scenario:

My controller is like:

var userData = $http(
{
     method: "post",
     url: "http://some-domain.com/t-app/mobile-data/login.php",
     data    : $scope.loginForm, //forms user object
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
userData.success(function (userdataobject)
{
    $rootScope.status_id = userdataobject["status_id"];
});

I know this will only work if the internet connection is available. My question is that, in this scenario, how do I know the error status like "404" or if internet connection is not available?

Upvotes: 0

Views: 93

Answers (3)

xZ6a33YaYEfmv
xZ6a33YaYEfmv

Reputation: 1816

There's status field (from docs):

// Simple GET request example:
$http({
  method: 'GET',
  url: '/someUrl'
}).then(
    function successCallback(response) {
        // this callback will be called asynchronously
        // when the response is available
    },
    function errorCallback(response) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
        if (response.status === 404)
        {
            //your code here
        }
});

In your case it's:

$http(
{
   method: "post",
   url: "http://some-domain.com/t-app/mobile-data/login.php",
   data    : $scope.loginForm, //forms user object
   headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
.then(
  function(response) {
    $rootScope.status_id = userdataobject.data["status_id"];
  },
  function(response) {
    if (response.status === 404) {
        //your code here
    }
  } 
);

Upvotes: 1

Dmitri Pavlutin
Dmitri Pavlutin

Reputation: 19080

In relation with your example:

var userData = $http({
     method: "post",
     url: "http://some-domain.com/t-app/mobile-data/login.php",
     data    : $scope.loginForm, //forms user object
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});

userData.success(function (userdataobject) {
    $rootScope.status_id = userdataobject["status_id"];
}).catch(function(errorResponse, status) {
    console.error(errorResponse); //for debugging
    if (errorResponse.status == 404) {
      //Handle 404 error 
    }
    //or if (status == 404) {}
});

The errorResponse will have these fields:

  • data – {string|Object} – The response body transformed with the transform functions.
  • status – {number} – HTTP status code of the response.
  • headers – {function([headerName])} – Header getter function.
  • config – {Object} – The configuration object that was used to generate the request.
  • statusText – {string} – HTTP status text of the response.

Upvotes: 1

Victor de Andres
Victor de Andres

Reputation: 68

Your code may be like this:

$http(
{
     method: "post",
     url: "http://some-domain.com/t-app/mobile-data/login.php",
     data    : $scope.loginForm, //forms user object
     headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(function successCallback(response) {
    $rootScope.status_id = response["status_id"];
}, function errorCallback(response) {
    console.error(response.status);
    console.error(response.statusText);
});

In this way you controller the success and error

Upvotes: 1

Related Questions