Proper Function Order

Ionic Framework
1

Hi all,

I am looking for a solution in the following problem:
I have 3 separate functions. The first two functions fire up a plugin which requires the user’s manual input in the process.
The third function only has a console log.
I would like to have a 4th one, that fires up the first 2 functions simultaneously, then upon completing them the 3rd one is fired.

What i tried was:

async function4() {
await function1();
await function2();
function3();
}

The problem is, that upon firing up function4, function1-2 fires up, but when the user input is due (plugin response), without completing them first, function3 is fired.

I also tried the promises with .then statements with no luck.

Can someone help me?

Regards,
Astrix

2

I would suggest to use forkJoin from rxjs https://www.learnrxjs.io/operators/combination/forkjoin.html

forkJoin will execute a list of promises and will resolve when all of these are done

so if I understand your question, something like

let promises = new Array();
promises.push(function1());
promises.push(function2());

forkJoin(promises).subscribe((results) => {
   function3();
});
2 Likes
3

I have tried your method:
Unfortunately, the forkJoin.subscribe event is not executed.
function1 and 2 is executed correctly, yet function 3 (also tried with a single console.log) is not working.

Maybe the first two functions are not really “completed”.
Any suggestions?

4

Weird I mean I use this in many pages/providers and components in my app

Difficult to tells more than without seeing your effective code

5

The error reads:
“core.js:1350 ERROR Error: Uncaught (in promise): TypeError: You provided ‘undefined’ where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
TypeError: You provided ‘undefined’ where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.”

6

which version of rxjs? newer: forkJoin… older: Observable.forkJoin

anyway like I said, when it comes to me, I can’t help more sorry without seeing effective code, good luck

7

So this is the code i’m trying to run - exactly as yours:

imports:
import { forkJoin } from ‘rxjs/observable/forkJoin’;

“Error: You provided ‘undefined’ where a stream was expected. You can provide an Observable, Promise, Array, or Iterable”

buttonTap1() {
  console.log("Hello message 1")
}

buttonTap2() {
  console.log("Message 2")
}

buttonTap3() {
  console.log("Message 3")
}


ThisButton() {

let promises = new Array();
promises.push(this.buttonTap1());
promises.push(this.buttonTap2());

forkJoin(promises).subscribe((results) => {
   this.buttonTap3();
});

Sorry for the inconvenience, hope this helps.

8

Your methods aren’t promises

 buttonTap1(): Promise<{}> {
     return new Promise((resolve) => {
           console.log('Use promise');
           resolve();
     });
 }
9

Right, rookie mistake - sorry.
Thank you very much!

10

No worries, cool to hear (I guess) it worked out :slight_smile:

11

Is Promise.all() an option to?

Put the array of functions promise or non promise in the argument

12

Definitely is

13

Dude, i just created an account to write this. THANKS!!!

1 Like
14

Haha my pleasure

Note: like other mentioned it above, you could either use forkJoin or Promise.all, both do the job

const promises = [];
promises.push(myFunction1());
promises.push(myFunction2());
promises.push(myFunction2());

await Promise.all(promises);
15

While it won’t bite you when using Promises (or one-shot Observables like those ordinarily returned by HttpClient), forkJoin can be tricky if you feed it long-lived Observables. It won’t complete until all of its arguments do, so even if the underlying Observables are emitting, you won’t see a peep out of forkJoin until they all complete.