CODEWITHSUNDEEP
angularjs
chichi
chichi

Reputation: 213

How to prevent action on failed $http.post in AngularJS

In my factory I make a service call. If I get a response from that call I want to do an action in my controller, (ie call function doAction()). I need some help though. As my code is working now, it does actions in controller even though service call fails.

If service call fails, code goes into Catch-section in the factory, but still returns to the controller so that doAction()-method is reached.

How can I avoid that? Thank you for your time, and excuse a possible stupid question. I'm pretty new to Angular.

In my factory:

app.factory('myFactory', function ($http) {
    return {

        callService: function () {
            return $http.post("http://xxxxx", {}, {headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
                .then(function(response) {
                    return response.data;
                })
                .catch(function(response) {
                    console.error(response.status, response.data);
                });
        },
    };
});

In my controller:

var app = angular.module('indexapp', ['ngRoute']);

app.controller('indexController', function($scope, myFactory) {

   $scope.makeServiceCall = function() {
        var data = myFactory.callService();
        data.then(function (result) {
            doSomeAction();
        });
    };    
});

Upvotes: 1

Views: 36

Answers (2)

Nikolaj Dam Larsen
Nikolaj Dam Larsen

Reputation: 5674

This is because by catching the exception, you're actually swallowing it. You either need to not catch the error in your factory, or rethrow the error like this:

app.factory('myFactory', function ($http) {
    return {

        callService: function () {
            return $http.post("http://xxxxx", {}, {headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
                .then(function(response) {
                    return response.data;
                })
                .catch(function(response) {
                    console.error(response.status, response.data);
                    throw response; // <-- rethrow error
                });
        },
    };
});

Upvotes: 2

Kaustubh Khare
Kaustubh Khare

Reputation: 3510

Return promise from factory service.

Factory:

app.factory('myFactory', function ($http) {
    return {

        callService: function () {
            return $http.post("http://xxxxx", {}, {headers: {'Content-Type': 'application/x-www-form-urlencoded'}});                    

    };
});

Controller

var app = angular.module('indexapp', ['ngRoute']);

    app.controller('indexController', function($scope, myFactory) {

       $scope.makeServiceCall = function() {
            var data;
            myFactory.callService().then(function(response) {
                    data = response.data;
                    doSomeAction();
                })
               .catch(function(response) {
                    console.error(response.status, response.data);
                });
        };    
    });

Upvotes: 2

Related Questions