Javascript waiting for multiple methods to return [duplicate]

Question

Explanation of code

I have a function which extracts the value from an html input and returns a formatted address. I call this function twice storing each address into appropriate variable. Once I have converted both inputs I want to call another function, function z.

ngAfterViewInit() {
    //get input elements, get the first tag within the ion-input tag
    this.searches.startSearch = document.getElementById("startSearch").getElementsByTagName('input')[0];
    this.searches.endSearch = document.getElementById("endSearch").getElementsByTagName('input')[0];


    var address1 = this.placeDecode(this.searches.startSearch)
    var address2 = this.placeDecode(this.searches.endSearch)


    this.methodZ(address1,address2);

}

 //method convertes input into formatted address
  private placeDecode(input : HTMLInputElement) {

    var location = input.value;

    var geoCode = new google.maps.Geocoder();

    geoCode.geocode({
      address: location
    }, function (result, status) {
      if (status === 'OK') {
        return result[0].formatted_address;

      } else {
        return null;
      }
    });
  }

Problem

The problem I am having is I only want to call function Z once both input have been converted. I have tried using callback but i can't call a function z within a callback.

This function doesn't do anything. You're returning into nothing. Why can't you call function z within a callback? Read and understand stackoverflow.com/q/14220321/476, then you probably want to use Promise.all() to await two promises. — deceze
– deceze ♦, Commented Jan 23, 2018 at 14:49
I didnt show all my code because there is no need, you can imagine me calling placeDecode and retrieving results, when calling z within callback, it says it is undefined — Yusof Bandar
– Yusof Bandar, Commented Jan 23, 2018 at 14:53
I can't really imagine how you call placeDecode and retrieve the result, because placeDecode doesn't return any result. — deceze
– deceze ♦, Commented Jan 23, 2018 at 14:55
Yeah, no. That's returning from an asynchronous callback, not from placeDecode. You really really need to read and understand this: stackoverflow.com/a/14220323/476 — deceze
– deceze ♦, Commented Jan 23, 2018 at 15:01

user4676340 · Accepted Answer · 2018-01-23 14:53:09Z

0

I didn't really understand your explanation, but I think I understood your issue : you want to wait for two functions to end, and call a thrid one, right ?

This is an asynchronous issue, and the best way to resolve that is using Promises.

In your method called two times, change your return statement to this :

return Promise.resolve(/* your old return value here */);

Now, you can call it twice :

const callOne = myAsyncFunction(/* params */);
const callTwo = myAsyncFunction(/* params */);

Finally, you can wait for both to resolve (and avoid a callback hell) :

Promise.all([callOne, callTwo]).then(function(values) {
  console.log(values); // will contain an array of two items
});

answered Jan 23, 2018 at 14:53

user4676340

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

5 Comments

Yusof Bandar Over a year ago

Cheers man helped alot

user4676340 Over a year ago

Glad I could help before the SOF police marked it :P Good luck with your project !

Yusof Bandar Over a year ago

yeah pretty annoying when i am trying to get some help

user4676340 Over a year ago

Well you have to understand, some questions are well documented and validated, you just have to know how to search, but I agree it's annoying when you want a simple answer customized to your own problem.

Yusof Bandar Over a year ago

Yeah sometimes I my specific problem can differ slightly from the well documented answer which can throw me off.

Collectives™ on Stack Overflow

Javascript waiting for multiple methods to return [duplicate]

Explanation of code

Problem

1 Answer 1

5 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

Explanation of code

Problem

1 Answer 1

5 Comments

Linked

Related