Angular Catch method not working with $http get request

Question

I am trying to neatly manage service function calls from the controller while handling errors from the API.

However when I do the following, I still get this is showing even with 403 and 404 errors in my console even when the API throws back a 403 or 404.

I am assuming this could work if I added catchin my services file but I would prefer keep this managed from the controller. Is this possible?

Controller:

angular.module('EnterDataCtrl', []).controller('EnterDataController', ['$scope', 'Data', '$state', function ($scope, Data, $state) {
    vm = this;
    vm.getRules = function (e, rule_query, data) {
        if (e.keyCode == 13) {

            Data.getRules(rule_query,data).then(function (data) {
                console.log('this is showing even with 403 and 404 errors');
            }).catch(function(res) {
                console.log(res);
            });
        }
    }
}]);

Service:

angular.module('EnterDataService', []).factory('Data', ['$http', function ($http) {

    return {

        getRules: function getRules(rule_query,data) {
            var apiBase = apiUrl + 'get-rules';
            var config = {
                handleError:true,
                params: {
                    rule_query: rule_query,
                    data : data
                }
            };
            return $http.get(apiBase, config).catch(function () {});
        }

    }
}]);

Possible duplicate of Error status codes are not being caught. When a rejection handler omits a throw statement, it returns undefined. This converts a rejected promise to a fulfilled promise that resolves to undefined. — georgeawg
– georgeawg, Commented Mar 11, 2017 at 8:53

Isaiah Lee · Accepted Answer · 2017-03-10 17:42:06Z

1

In your service, you are setting up the catch without doing anything. This in general is bad practice, if you're going to use a catch block, then handle the error there. If not, don't declare the catch at all.

You can either remove the catch completely from the service method, which should result in your controller's catch handling it.

OR, you can leave the catch in the service call, and make sure to throw so that the error correctly bubbles up.

answered Mar 10, 2017 at 17:42

Isaiah Lee

4482 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

georgeawg · Accepted Answer · 2017-03-11 09:21:02Z

When a rejection handler omits a throw statement, it returns undefined. This converts a rejected promise to a fulfilled promise that resolves to undefined.

To avoid unintended conversions, it is important to include a throw statement in rejection handlers.

app.service('Data', ['$http', function ($http) {

    this.getRules = function getRules(rule_query,data) {
        var apiBase = apiUrl + 'get-rules';
        var config = {
            handleError:true,
            params: {
                rule_query: rule_query,
                data : data
            }
        };
        //return $http.get(apiBase, config).catch(function () {});
        return $http.get(apiBase, config)
          .catch(function (errorResponse) {
             console.error("Data service error");
             //IMPORTANT
             throw errorResponse;
        });
    }
}]);

Collectives™ on Stack Overflow

Angular Catch method not working with $http get request

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related