Search code examples
javascriptangulartypescriptrxjsobservable

Wait for observable to complete


I have series of methods which are dependent on completion of other methods.

process1(data: string) : Observable<string> {
   this.dataservice.process(data).subscribe(
            (response) => {
                return response.data;
            }
        );
}

main(data: string) : string {

   var process1Data: string = process1(data); 

   // I would like to wait for process1 method to complete before running process2
   // I do not want to include process2 inside subscribe of process1 because I have to make few more method calls
   var process2Data: string = process2(process1Data);

   var process3Data: string = process3(process2Data);

   ...

}

How can I wait for an observable to complete before calling next method (process2, process3)? (similar like await in c#)


Solution

  • You might try something like this...

    main(data: string) : string {
    
        process1Data$: Observable<string> = process1(data)
            .take(1)
            .switchMap((process1Data) => return process2(process1Data);
        .
        .
        .
    }
    

    Obviously, take(1) assumes that process1(...) resolves to single value and stops. After that it switchMaps to process2 which means it starts emitting whatever observable from process2 gives. If, on the other hand, you want process2 to be ran of each result emitted from process1 then just remove take(1).