2016-10-14 12 views
3

私はAngular 2アプリ用のカスタムXHRBackendを実装しようとしています。これは私のクラスである:複数のリクエストを実行せずにrxjsオブザーバを複数回購読する

import {Request, XHRBackend, BrowserXhr, ResponseOptions, XSRFStrategy} from "@angular/http"; 
import "rxjs/add/operator/catch"; 
import "rxjs/add/observable/throw"; 
import {SlimLoadingBarService} from "ng2-slim-loading-bar"; 

export class LoadingBarXHRBackend extends XHRBackend { 
    constructor(_browserXhr: BrowserXhr, _baseResponseOptions: ResponseOptions, _xsrfStrategy: XSRFStrategy, private slimLoadingBarService: SlimLoadingBarService) { 
     super(_browserXhr, _baseResponseOptions, _xsrfStrategy); 
    } 

    createConnection(request: Request) { 
     this.slimLoadingBarService.start(); 

     let xhrConnection = super.createConnection(request); 

     xhrConnection.response.share().subscribe(() => { 
      this.slimLoadingBarService.complete(); 
     }); 

     return xhrConnection; 
    } 

} 

あなたがhereを説明するように、私は.share()メソッドを使用してみましたが、それは、私はそれが期待するように動作しません見ることができるように。

ローディングバーを表示するためのXHR要求の作成と完了に「夢中になりたい」と思います。しかし、.share()を呼び出すと、.subscribe()呼び出しごとに別々のHTTP要求が出ます。

しかし、私は.shareを使用している場合()私の2番目のサブスクリプションは、私が間違って何をやっているすべての:(

で実行されることはありませんおかげで

+0

おそらくhttp://stackoverflow.com/questions/36271899/what-is-the-correct-way-to-share-the-result-of-an-angular-2-http-network-call-in –

答えて

2

これを試してみてください:?。

createConnection(request: Request) { 
    this.slimLoadingBarService.start(); 

    let xhrConnection = super.createConnection(request).response.share(); 

    xhrConnection.subscribe(() => { 
     this.slimLoadingBarService.complete(); 
    }); 

    return xhrConnection; 
} 

サブスクライブとリターンの前にshare()にする必要があり、内部と外部の両方が観測可能なもののマルチキャスト版を取得します。

ただし、thaあなたの代わりにこれを実行する場合がありますので、トンのシェアは、ホット観測可能にしてobseravbleを回す:

createConnection(request: Request) { 
    return Observable.defer(() => { 
     this.slimLoadingBarService.start(); 

     return super.createConnection(request).response 
      .do(() => this.slimLoadingBarService.complete()); 
    }); 
} 

Observable.deferは、あなたが実際にそれに加入刚性その中のコードのいずれも実行されないことを意味します。 doオペレータは、ストリームに影響を与えずにイベントストリームをタップします。

関連する問題