next()がサブスクライバーに通知しないのはなぜですか?rxjs

フランコ

httpsリクエストが終了すると通知するロード画面を作成しようとしていますが、next(false)を使用してサブスクライバーに通知すると通知されません

Loading.service.ts

import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { finalize } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class LoadingService implements HttpInterceptor {

  loading$ = new BehaviorSubject<boolean>(true);
  activeRequests: number = 0

  constructor() { }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (this.activeRequests >= 0) {
      this.activeRequests++
      this.loading$.next(true)
    }

    return next.handle(req).pipe(
      finalize(() => {
        this.activeRequests--;
        this.loading$.next(true)
        if (this.activeRequests === 0) {
          this.loading$.next(false)
        }
      })
    )

  }

}

Loading.component.ts

import { AfterViewInit, ChangeDetectorRef, Component, ComponentRef, ElementRef, OnDestroy, OnInit } from '@angular/core';
import { Subject, Subscription } from 'rxjs';
import { LoadingService } from 'src/app/services/loading.service';

@Component({
  selector: 'app-loading',
  templateUrl: './loading.component.html',
  styleUrls: ['./loading.component.css']
})
export class LoadingComponent implements OnDestroy, OnInit {

  loadingSubscription: Subscription;

  constructor(
    public loadingService: LoadingService,
    private elementRef: ElementRef,
    private changeDetectorRef: ChangeDetectorRef
  ) {
  }

  ngOnInit(): void {
    this.elementRef.nativeElement.style.display = 'none'
    this.loadingSubscription = this.loadingService.loading$
      .subscribe(
        (status: boolean) => {
          console.log('status', status)
          this.elementRef.nativeElement.style.display = status ? 'block' : 'none'
          this.changeDetectorRef.detectChanges()
        }, (err) => {
          console.log('err', err)
        }
      )
  }

  ngOnDestroy(): void {
    console.log('unsubcribe')
    this.loadingSubscription.unsubscribe()
  }

}

無視:あなたの投稿はほとんどコードのようです。詳細を追加してください。投稿のほとんどがコードのようです。

Mehran Beiglou

インターセプターを2回提供し、loading.service.tsからインターセプターを削除したために問題が発生しました。詳細については正しい場所ではなかったため、これらの変更を確認できますhttps://github.com/FrancoRodao/administrador-empleados-frontend/pull / 1 / commits / 23d65d6926a764bc37c1e32acb269f3f8e7c15c8

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

最終的に例外でブロックがクライアントサーバープログラムで機能しないのはなぜですか?

分類Dev

OutOfMemoryErrorサブクラスがないのはなぜですか?

分類Dev

RxJS / Angular2:サブジェクトサブスクライバーが呼び出されないのはなぜですか?

分類Dev

C ++ ZeroMQサブスクライバーがデータを受信しないのはなぜですか?

分類Dev

アレイのObservableとサブスクライバーが機能しないのはなぜですか?

分類Dev

Promiseに変換する前に、ここでオブザーバブルをサブスクライブする必要がないのはなぜですか?

分類Dev

スーパーにクラス属性のサブセットしかないのはなぜですか?

分類Dev

サーバーがWebブラウザーからのクライアントの要求に応答できないのはなぜですか?

分類Dev

サブスクリプションコールバックのエラーでRxjsがサブスクライブを解除するのはなぜですか?

分類Dev

groupBy演算子の後にサブスクライブが呼び出されないのはなぜですか?

分類Dev

対象の観測可能なサブスクライバーが角度で複数回呼び出しているのはなぜですか?

分類Dev

ライブサーバーがVisualStudio Codeで機能しないのはなぜですか?

分類Dev

pyzmqサブスクライバーがasyncioと異なる動作をするのはなぜですか?

分類Dev

FlowAPIサブスクライバーのonCompleteからクラス変数にアクセスできないのはなぜですか

分類Dev

Laravelメールがライブサーバーで機能しないのはなぜですか?

分類Dev

クライアントがサーバーに接続しないのはなぜですか?Qt

分類Dev

サブクラスがスーパークラス変数の値をオーバーライドしないのはなぜですか?

分類Dev

スクロールバーがないのに、モバイルデバイスでサイトの表示が異なるのはなぜですか

分類Dev

サブクラス変数が存在しないのはなぜですか?

分類Dev

このJavaTCPクライアント/サーバーが機能しないのはなぜですか?

分類Dev

コールバックがaxiosライブラリで機能しないのはなぜですか?

分類Dev

統合フローがfromチャネルにサブスクライブしないのはなぜですか?

分類Dev

RxJS:サブスクライブ内で「これ」が定義されていないのはなぜですか

分類Dev

バックグラウンドサービス(System.Timerを使用)にトースト通知が表示されないのはなぜですか?

分類Dev

クラスターSSHがUbuntuサーバーで機能しないのはなぜですか?

分類Dev

サービスにサブスクライブした後、アレイが更新されないのはなぜですか?

分類Dev

サブクラスメンバーが保護されていないのはなぜですか?

分類Dev

インターセプターがサブスクライバーにデータを返さないのはなぜですか?

分類Dev

RxJava 2:PublishProcessorがObservableにサブスクライブできないのはなぜですか?

Related 関連記事

  1. 1

    最終的に例外でブロックがクライアントサーバープログラムで機能しないのはなぜですか?

  2. 2

    OutOfMemoryErrorサブクラスがないのはなぜですか?

  3. 3

    RxJS / Angular2:サブジェクトサブスクライバーが呼び出されないのはなぜですか?

  4. 4

    C ++ ZeroMQサブスクライバーがデータを受信しないのはなぜですか?

  5. 5

    アレイのObservableとサブスクライバーが機能しないのはなぜですか?

  6. 6

    Promiseに変換する前に、ここでオブザーバブルをサブスクライブする必要がないのはなぜですか?

  7. 7

    スーパーにクラス属性のサブセットしかないのはなぜですか?

  8. 8

    サーバーがWebブラウザーからのクライアントの要求に応答できないのはなぜですか?

  9. 9

    サブスクリプションコールバックのエラーでRxjsがサブスクライブを解除するのはなぜですか?

  10. 10

    groupBy演算子の後にサブスクライブが呼び出されないのはなぜですか?

  11. 11

    対象の観測可能なサブスクライバーが角度で複数回呼び出しているのはなぜですか?

  12. 12

    ライブサーバーがVisualStudio Codeで機能しないのはなぜですか?

  13. 13

    pyzmqサブスクライバーがasyncioと異なる動作をするのはなぜですか?

  14. 14

    FlowAPIサブスクライバーのonCompleteからクラス変数にアクセスできないのはなぜですか

  15. 15

    Laravelメールがライブサーバーで機能しないのはなぜですか?

  16. 16

    クライアントがサーバーに接続しないのはなぜですか?Qt

  17. 17

    サブクラスがスーパークラス変数の値をオーバーライドしないのはなぜですか?

  18. 18

    スクロールバーがないのに、モバイルデバイスでサイトの表示が異なるのはなぜですか

  19. 19

    サブクラス変数が存在しないのはなぜですか?

  20. 20

    このJavaTCPクライアント/サーバーが機能しないのはなぜですか?

  21. 21

    コールバックがaxiosライブラリで機能しないのはなぜですか?

  22. 22

    統合フローがfromチャネルにサブスクライブしないのはなぜですか?

  23. 23

    RxJS:サブスクライブ内で「これ」が定義されていないのはなぜですか

  24. 24

    バックグラウンドサービス(System.Timerを使用)にトースト通知が表示されないのはなぜですか?

  25. 25

    クラスターSSHがUbuntuサーバーで機能しないのはなぜですか?

  26. 26

    サービスにサブスクライブした後、アレイが更新されないのはなぜですか?

  27. 27

    サブクラスメンバーが保護されていないのはなぜですか?

  28. 28

    インターセプターがサブスクライバーにデータを返さないのはなぜですか?

  29. 29

    RxJava 2:PublishProcessorがObservableにサブスクライブできないのはなぜですか?

ホットタグ

アーカイブ