如何使用http拦截器正确处理离子加载组件？

Question

我有几个按顺序完成的http请求，并且我有一个HTTP拦截器，可以处理该请求链。现在，我想通过使用离子加载组件来实现加载机制。我的问题是，在下载所有数据之后，我想在第一个http请求上显示离子加载组件，并在最后一个HTTP请求的末尾将其关闭。当我尝试执行我的代码时，其效果是，有时候，该组件不会被关闭，从而阻止了用户与应用程序的任何交互。

HTTP_INTERCEPT-服务

df1=df[df.groupby('id').station.transform('nunique')==1].copy()

加载-服务

@Injectable()
export class ConnectionService implements HttpInterceptor {
    requestCount: number;

constructor(
    public userService: UserService,
    public loadingService: LoadingService
) { 
    this.requestCount = 0;
}

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    return from(this.userService.getUser()).pipe(switchMap(user => {
        if (user) {
            request = request.clone({
                setHeaders: {
                    'X-Auth-Token': user.auth
                }
            })
        }

        if (this.requestCount === 0) {
            this.loadingService.showLoading();
        }

        this.requestCount++;
        return next.handle(request).pipe(
            retry(1),
            catchError((error: HttpErrorResponse) => {
                return throwError(error);
            }),
            finalize(() => {
                this.requestCount--;

                if (this.requestCount === 0) {
                    this.loadingService.hideLoading();
                }
            })
        );
    }));
}
}