kjbeamer
kjbeamer

Reputation: 95

Error handling in Angularjs for deferred promise

I built a factory to return data that uses an HTTP Get through a deferred promise. It work great when it is the happy path and the url is correct. But when there is an error I would like to catch it. It seems that I am but a 500 error still shows in the console. Is there a way to catch this also? Also, I want to do processing on the reject I'm having trouble figuring out how to do that. TIA

angular.module("accQueries")
    .factory('leaseFactory', ['$http', '$q', function ($http, $q) {

            return {
                leases: '',
                makeRequest: function (url) {
                    // Create the deferred object
                    var deferred = $q.defer();

                    $http.get(url).then(function (resp) {
                        deferred.resolve(resp.data);
                    })
                    // potentially catch http error here??
                    .catch(function (err) {
                        deferred.reject(err);
                        console.log('rejected  : ' + err );
                        console.dir(err);
                        this.leases = '';
                    });

                    return deferred.promise;
                },
                // Return a single lease based on lease number
                getLease: function (pLeaseNum) {
                    this.leases = this.makeRequest("http://someserver/AccruentQA_DB/webresources/restfulservices.latbllease/leaseNumber/" + pLeaseNum);
                    // Return the lease object stored on the service
                    return this.leases;
                },
                // Return all leases based on lease name
                getLeases: function () {
                    this.leases = this.makeRequest("http://someserver/AccruentQA_DB/webresources/restfulservices.latbllease/name/");

                    // Return the lease object stored on the service
                    return this.leases;
                }
            };

        }]);

Upvotes: 0

Views: 2756

Answers (2)

Dave
Dave

Reputation: 4412

There's no way to prevent the HTTP error from appearing in the console. The browser does that before it passes the results back to angular. However, an error causes the $http promise to be rejected, which means you can handle it using the optional second argument to then()

return $http.get('url').then(
    function(response) { 
        this.leases = response.data;
    },
    function(response) {
        var statusCode = response.status;
        var response = response.data;
        // other error processing
        this.leases = '';
    }
}).then(function() { return this.leases; }

You can do various things depending on the status code and response data. If your server emits an error 500, that's what response.status will be. Timeouts have a status of 0.

You should also be aware that getLease() will return before the ajax request is complete. You should return the promise, and then in the calling code, chain another then() to do something once the promise is resolved.

Upvotes: 1

Kenneth Van den Berghe
Kenneth Van den Berghe

Reputation: 275

It is not needed to wrap a $http call in $q, because $http returns a promise itself. So just returning $http like this is sufficient:

makeRequest: function (url) {
   return $http.get(url);
}

If you would want to chain do something in the makeRequest function with the answers be4 passing it on, you can chain promises like so:

makeRequest: function (url) {
   return $http.get(url).then(function(response){
      //do something
      return response; 
   }, function(error){
      //do something
      return error;
   });
}

Upvotes: 3

Related Questions