Angular4：ここで設定するのHttpClientのインターセプターを使用してスピナー

Question

私が期待どおりに働いて迎撃

@Injectable() 
export class ApiInterceptor implements HttpInterceptor { 
    constructor(private _globalSpinnerService: GlobalSpinnerService) {} 

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
     const spinnerParam: string = req.params.get("spinner") 
     let handleObs: Observable<HttpEvent<any>> = next.handle(req) 
     if(spinnerParam) { 
      this._globalSpinnerService.spinner = true 
      handleObs.toPromise().then(() => { 
       this._globalSpinnerService.spinner = false 
      }) 
     } 

     return handleObs 
    } 
} 

経由で直接スピナーを処理するために書いた迎撃。しかし、私はスピナーが2回送られてくるという私の要求をすべて見ています。だから私はスピナーを取り除くための自分のやり方が最善ではないと思う。ハンドルが終了したら、私のスピナーを取り除くためにインターセプターにどのように伝えることができますか？

はEDIT：

は、私は私のhandleObs.toPromise().thenhandleObs.do()によると、それは今働いて罰金を交換することにより、コードを変更しました。私はちょうどなぜわからない

Answer 1

これは、handleObsが寒いから、toPromiseがサブスクリプションを作成し、httpClient(...).subscribeが別のサブスクリプションを作成するために起こります。これはいくつかの要求をもたらす。そして、はい、handleObs.do()を代わりに使用する必要があります。サブスクリプションには至らず、単に副作用があります。

それが適切に同時要求を処理しなければならないので、一般的には、スピナーのための要求カウンタを有することが望ましい：

function spinnerCallback() { 
    if (globalSpinnerService.requestCount > 0) 
    globalSpinnerService.requestCount--; 
} 

if(spinnerParam) { 
    globalSpinnerService.requestCount++; 
    handleObs.do(spinnerCallback, spinnerCallback); 
} 

そしてglobalSpinnerService.spinnerは、実際のゲッターです：

get spinner() { 
    this.requestCount > 0; 
}