角度2の前回のリクエストの結果に基づいてHTTPリクエストを実行

Question

ObservableをAngular 2で使用する場合、非同期ストリームを処理したいと考えています。 詳しくは、すべてのユーザーのリクエストの前に、有効であれば、ユーザーは適切な応答を得ることができます。したがって、以下のように実際のリクエストの前にhttpリクエストを行う必要があります。getServiceTicket（）というメソッドを呼び出しますが、非同期ストリームのため、有効なサービスチケットを取得する前に、次のhttpリクエスト（getDetail）有効なサービスチケット。だから私はisServiceTicketのようなフラグを使用しようとしましたが、私はそれがこれらの2つのメソッドの連続実行を保証しないことを認識します。私はいくつかの研究を試みましたが、満足のいく答えを見つけることができませんでした。誰かがこれに対して良い解決策を持っているなら、いくつかの助言を与えることができますか？

getServiceTicket() { 
    this.userAuthServie.getServiceTicket().subscribe(
     (data: string) => {this.serviceTicket = data; this.isServiceTicket = true;} 
    ); 
} 

getDetail(id: string) { 
    this.getServiceTicket(); 
    return this.http.get('https://localhost/detail/' + id + '?ticket=' + this.serviceTicket) 
    .map((responseData) => { 
     return <User>responseData.json(); 
    } 
    ); 
} 

Answer 1

あなたは以下のようなヨールのコードを変更することができます。

user:User; 

     getDetail(id: string) { 

     this.userAuthServie.getServiceTicket() 
      .subscribe((data: string) => { 
      this.serviceTicket = data; 
      this.isServiceTicket = true; 
      this.http.get('https://localhost/detail/' + id + '?ticket=' + this.serviceTicket) 
       .map((responseData) => { 
       this.user= <User>responseData.json(); 
       }); 
      }); 

     } 

Answer 2

あなたが最初の関数の購読方法の成功の一部で実行したい第2の機能を配置することができます。

getServiceTicket() { 
    this.userAuthServie.getServiceTicket().subscribe(
     (data: string) => { 
      this.serviceTicket = data; this.isServiceTicket = true; 
      this.getDetail(id); 
     } 
    ); 
} 

Answer 3

「詳細要求」が実行される前にサービスチケットがロードされるのを待つ場合は、解決するためのサービスチケットの応答を待つ必要があります。複数の方法があります。詳細をキューに追加する方法と、サービスチケットが読み込まれるまでgetDetailsを待機させる方法があります。

getServiceTicket() { 
    // you need to return the observable from service ticket 
    return this.userAuthServie 
     .getServiceTicket() 
     // use map here to only intercept the value. 
     // remember that you need to subscribe somewhere else 
     // if called from elsewhere than getDetail 
     .map((data: string) => { 
      this.serviceTicket = data; 
      this.isServiceTicket = true; 
      return data; 
     }); 
} 

getDetail(id: string) { 
    return this.getServiceTicket() 
     // we switch the observable from ticket to the one from detail using switchMap 
     .switchMap((data: string) => { 
      let url = 'https://localhost/detail/' + id + '?ticket=' + this.serviceTicket; 
      return this.http 
       .get(url) 
       .map((responseData) => { 
        return <User>responseData.json(); 
       }); 
     }); 
    } 
}