web-dev-qa-db-ja.com

オブザーバブルが完了するのを待つ

他のメソッドの完了に依存する一連のメソッドがあります。

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);

   ...

}

オブザーバブルが完了するのを待ってから、次のメソッド（process2、process3）を呼び出すにはどうすればよいですか？ （c＃でawaitと同様）

javascriptangulartypescriptrxjsobservable
5
developer

あなたはこのようなものを試すかもしれません...

_main(data: string) : string {

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

明らかに、take(1)は、proces1(...)が単一の値に解決されて停止すると想定しています。その後、switchMapsを_process2_に変換します。これは、process2から取得できる監視対象をすべて出力し始めることを意味します。一方、_process2_がfrmo process1によって発行された各結果に対して実行されるようにするには、take(1)を削除します。

7
dee zg

Rxjs concat演算子を使用できます。こちらのドキュメントをご覧ください。 連結

基本的に、最初またはソースオブザーバブルが戻るまで待機してから、次に実行します。

更新

要件に応じて、switchやswitchmapなどの演算子を試すこともできます。

2
Steve

Es6 async/awaitを使用できます

async main(data: string): string {
    var process1Data: string = await process1(data).toPromise();
    var process2Data: string = process2(process1Data);
    ...
}
2
Aleksandr Petrovskij

process1が返されないため、元の質問のObservable<string>は混乱します（ 'rxjs/Observable'の別のObservableを使用している可能性があります）。

これは私が（元の質問で）参照しているコードです：

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

私にとっては、これを次のように変更しました：

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

次に、process1の完了後に何かを実行するには、他のsubscribeと同じようにObservableを使用します。

main(data: string) : string {
   process1(data).subscribe((process1RetVal)=>
   {
         process2(process1RetVal);
   });
}
1
Ambrose Leung