promise.then() not working when I send in another promise into it

Question

I have 2 function getAccountInfo() and getAdjustmentsInfo(accountInfo) they both return a new promise. The only different is that the second function needs the information returned from the first function.

I tried to declare these 2 function first, and call them one by one using then(). But it is not working as I expected.

These are the functions, as you can see the second function needs account_code from the first accountInfo object:

function getAccountInfo() {
    return new Promise((resolve, reject) => {
        getAccountCallbackFunc((errResponse, response) => {
            if (errResponse) {
                return reject(errResponse);
            }
            resolve(response);
        });
    });
}

function getAdjustmentsInfo(accountInfo) {
    return new Promise((resolve, reject) => {
        getAdjustmentCallbackFunc(accountInfo[0].account_code, function (errResponse, response) {
            if (errResponse) {
                reject(errResponse);
            }
            if (response) {
                resolve(response);
            }
        });
    });
}

This is the controller code to call the functions:

var accountInfo = {};

getAccountInfo()
    .then(response => {
        accountInfo = response.data.accounts.account;
        console.log(accountInfo);
    })
    .then(getAdjustmentsInfo(accountInfo))
    .catch(err => console.log(err));

So I run the getAccountInfo() function first and run the first then() to saved the account information to the external variable accountInfo. Next I run the second then() trying to pass the accountInfo to the second function, which is not working, the second function never got called. Is that something I am missing? Please let me know.

Seems like you have to understand [return the response from asynchronous call](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Gangadhar Jannu, Aug 14 '19 at 18:22
Well, you need to send a callback function to `.then()` not another promise. — Bergi, Aug 14 '19 at 18:36

score 1 · Answer 1 · answered Aug 14 '19 at 18:23

You are evaluating the getAdjustmentsInfo method immediately, since it's not in a callback. Try:

var accountInfo = {};

getAccountInfo()
    .then(response => {
        accountInfo = response.data.accounts.account;
        console.log(accountInfo);
    })
    .then(() => getAdjustmentsInfo(accountInfo))
    .catch(err => console.log(err));

Or even better:

var accountInfo = getAccountInfo()
    .then(response => {
        console.log(response.data.accounts.account);
        return response.data.accounts.account;
    })
    .then(account => getAdjustmentsInfo(account))
    .catch(err => {
        console.log(err));
        return {};
    })

Thank you for your answer, it is very helpful. – Tian Qin Aug 14 '19 at 19:09 — Tian Qin, Aug 14 '19 at 19:09

score 1 · Answer 2 · answered Aug 14 '19 at 18:24

1

You call getAdjustmentsInfo straight away instead of waiting for getAccountInfo and you don't return a Promise in the first then. I think this is what you mean to do:


getAccountInfo()
    .then(response => {
        accountInfo = response.data.accounts.account;
        return getAdjustmentsInfo(accountInfo)
    })
    .catch(err => console.log(err));

answered Aug 14 '19 at 18:24

Mohrn

816
4
15

1

Thank you for the help, this is very helpful.And it worked. – Tian Qin Aug 14 '19 at 19:10

score 1 · Accepted Answer · answered Aug 14 '19 at 18:41

1

There are couple of mistakes in your code. First is that you are not returning anything nor resolving any promise in the line accountInfo = response.data.accounts.account;console.log(accountInfo); so the .then(getAdjustmentsInfo(accountInfo)) will not be called. Secondly, i suppose the first argument to a .then() is always a callback with the first argument being something that is returned from the previous Promise.

Your function getAccountInfo() returns a promise. When that promise is resolved you can directly use that as follows.

var accountInfo = {};

getAccountInfo()
     .then(response => {
          accountInfo = response.data.accounts.account;
          console.log(accountInfo);
          getAdjustmentsInfo(accountInfo)
      })
     .then(resultFromPreviousPromise => {
       //Use the resultFromPreviousPromise if wanted else you can skip this .then()
      })
     .catch(err => console.log(err));

answered Aug 14 '19 at 18:41

Apoorv

622
8
22

Thanks for the help. It worked. I do have one more question, when I run console.log(accountInfo) in the second then(), it prints undefined, is accountInfo = response.data.accounts.account only exist in the scope of first then() ? – Tian Qin Aug 14 '19 at 19:12
If you are referring to the code that i have put then that should not be the case. The variable `accountInfo` is scoped outside the two functions so both should have access to it and even the second `.then()`. Could you paste the whole code that is causing this behaviors so we can see what might be causing it – Apoorv Aug 14 '19 at 19:38
var accountInfo = {}; var adjustmentsInfo = {}; getAccountInfo() .then(response => { accountInfo = response.data.accounts.account[0]; //console.log(accountInfo); getAdjustmentsInfo(accountInfo) }) .then(response => { adjustmentsInfo = response.data.adjustments; console.log(accountInfo); console.log(adjustmentsInfo); }) .catch(err => console.log(err)); – Tian Qin Aug 14 '19 at 19:40
This is the code, the function declare stays the same. – Tian Qin Aug 14 '19 at 19:41
Nvm it worked, you are right, the part I am showing undefined is not the accountInfo. Thank you ! – Tian Qin Aug 14 '19 at 19:47
Happy to help !! – Apoorv Aug 14 '19 at 19:58

score 1 · Answer 4 · answered Aug 14 '19 at 18:45

Try this, I hope it helps.

    function getAccountInfo() {
        return new Promise((resolve, reject) => {
            getAccountCallbackFunc((errResponse, response) => {
                if (errResponse) {
                    return reject(errResponse);
                }
                resolve(response);
            });
        });
    }

    function getAdjustmentsInfo(accountInfo) {
            getAdjustmentCallbackFunc(accountInfo[0].account_code, function (errResponse, response) {
                if (errResponse) {
                    return console.log(errResponse);
                }
                    resolve(response);
            });
    }

    var promise = new Promise(function(resolve, reject){
        getAccountInfo()
        .then(response => {
            resolve(response.data.accounts.account);
            console.log(accountInfo);
        })
    }).then(function(data){
        getAdjustmentsInfo(data);
    }).catch(function(err){console.log(err)});

promise.then() not working when I send in another promise into it

4 Answers4