Error handling in AngularJs

Question

I am trying to figure out the best way to perform error handling in AngularJs. I am making API calls via $resource and I came up with the following code:

emailService.create($scope.emailTemplate).$promise.then(function(data) {
    if (data.success) {
        $rootScope.showSuccess("Template created.");
        $scope.reset();
    }
}, function (error) {
    if (error.data != null) {
        $rootScope.showError(error.data);
    } else {
        $rootScope.showError();
    }
});

$rootScope.showError() and .showSuccess are just basic functions that display a message in a div.

Is there anyway to intercept $resource errors and perform the logic above without having to liter my controller with this code in every call I make?

Thank you!

Just a comment unrelated to the question: instead of storing a function on $rootScope you should create a service and store it in there. — Nick
– Nick, Commented Jun 11, 2014 at 13:43

Phil Sandler · Accepted Answer · 2014-06-11 13:42:59Z

2

You can create a global error handler using an http interceptor.

See Interceptor Section of the AngularJs $http documentation.

answered Jun 11, 2014 at 13:42

Phil Sandler

28.1k21 gold badges88 silver badges153 bronze badges

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

Comments

Community · Accepted Answer · 2017-05-23 10:09:50Z

0

To catch all $resource errors, use an HTTP Interceptor, as suggested in this answer.

If you require fine-grained control over your error-handling, in the supplied example, you could move your error-handling logic into a separate function. This allows you to re-use it.

Example:

 emailService.create($scope.emailTemplate).$promise.then(function(data) {
    if (data.success) {
        $rootScope.showSuccess("Template created.");
        $scope.reset();
    }
})
.catch(errorCatcher);

function errorCatcher(error) {
    if (error.data != null) {
        $rootScope.showError(error.data);
    } else {
        $rootScope.showError();
    }
};

Should you want to re-use this in other controllers, you could create an error-handling service that provides this function.

edited May 23, 2017 at 10:09

CommunityBot

11 silver badge

answered Mar 6, 2015 at 15:21

RdN

3,2831 gold badge19 silver badges18 bronze badges

Collectives™ on Stack Overflow

Error handling in AngularJs

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related