AngularJS : Pass additional parameters to chained promises
Asked Answered
H

1

9

I want to chain some promises that are returned by services. This works, as long as some of the methods that return the promises, doesn't require additional parameters. This is my example:

var first = function() {
  var d = $q.defer();
  $timeout(function() {
    d.resolve("first resolved")
  }, 100)
  return d.promise;
};

var second = function(val) {
  console.log("value of val: ", val);
  var d = $q.defer();
  $timeout(function() {
    d.resolve("second resolved")
  }, 200)
  return d.promise;
};

first().then(second).then(function(value) {
  console.log("all resolved", value);
});

This works as expected. But what if my service second needs an additional parameter val to do it's job? With the method above the value of val is "first resolved", because it get's the resolved value from first.

Is there any way around, without nesting anonymous functions like this:

first().then(function() {
  return second("foobar").then(function(value) {
    console.log("all resolved", value);
  });
});

I was thinking about using $q.all, but IMHO you can't specify an order for your promises.

Hugh answered 23/7, 2014 at 11:52 Comment(3)
$timeout already returns a promise, no need for a $q.deferthereHermit
I know, it was just for demonstration purpose. In my real case, I have a http call and after that, do some processing with the data. So I do need an extra $q.deferHugh
uhh... $http also returns a promise already and you can .then it for the extra processing and return that... can't make a judgement about code I haven't seen but it still sounds like the deferred anti pattern. You only need $q.defer when working against a callback API when promisifying it.Hermit
S
10

Of course. First way:

first()
  .then(function() {
    return second("foobar");
  })
  .then(function(value) {
    console.log("all resolved", value);
  });

Second (much easier) way:

first()
  .then(second.bind(null, "foobar"))
  .then(function(value) {
    console.log("all resolved", value);
  });
Spurn answered 23/7, 2014 at 11:59 Comment(3)
You're welcome. The important thing is you have to always remember the function can be called only by the promise. So if you need additional parameters or you need to do something with a given value, you have to wrap it or bind it and pass a plain function to the then call. And then the function can return another promise.Spurn
@Mawg In that case you should return an object or an array containing the desired values.Spurn
Can you show an example, for a Mawg of very little brain? ;-)Otranto

© 2022 - 2024 — McMap. All rights reserved.