$ q.reject and error handling in AngularJS chained promises

Question

I am having trouble understanding the basic concept of error handling with a chain of promises. To learn the rules, I wrote a simple example, guessing what the result would be. But, unfortunately, he does not behave the way I would. I read several articles about the subject, but maybe I can’t get the details because of my poor English.

Anyway, here is my code:

var promiseStart = $q.when("start"); var promise1 = promiseStart.then(function() { return Serviceforpromise1.get(); }); var promise2 = promise1.then(function(data1) { return Serviceforpromise2.get(data1); },function(error) { return $q.reject(); }); var promiseend = promise2.then(function(data2) { return data2; },function(error) { return error; }); return promiseend; 

Well, I know that it might be better encoded, but it's just for that purpose. Here is the code for the Serviceforpromise1 function:

  function Serviceforpromise1() { ... return $http.get(*whatever*).then(function (data){ return data; },function(error) { return $q.reject(); }); } 

Consider only the case of Serviceforpromise1 failure. A $ q.rejec t is sent back to the main chain, so I'm waiting for the " prom1. Then ( ") error callback, and it worked as expected. For example, I decided to pass the error to " prom2.then ", so in this error callback I added the line return $ q.reject () ; But it never reached the second error callback (" prom2.then "), and I don't understand why (for example, Serviceforpromise1, I returned the rejected promise!)

I will be happy to deeply understand what is happening here. Thank you for your help.

Answer 1

Your understanding is correct, and the problem seems to lie somewhere in how you try to observe this behavior (in what you did not show us).

If you return the rejected promise from the successful or error handler to then() , then the promise returned by then() will resolve the rejected promise. Note:

 angular.module('app', []) .controller('C', [ '$q', function ($q) { var promiseStart = $q.when("start"); var promise1 = promiseStart.then(function (value) { console.log('Got a value:', value); return $q.reject('Error!'); }); var promise2 = promise1.then(function (data1) { return "Got some stuff"; }, function (error) { console.log("Caught an error:", error); return $q.reject('New error'); }); var promiseend = promise2.then(function (data2) { return data2; }, function (error) { console.log('Caught an error:', error); // <-- this is logged to the console return error; }); return promiseend; }]); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script> <div ng-app='app' ng-controller='C'></div> 

It should be noted here that in this last handler you return the error variable and do not throw an exception or return a rejected promise. Thus, in this case, the promiseend will be successfully resolved with the value of this variable error .