I have a busyservice.ts

import { Injectable } from '@angular/core';
import { LoadingController } from '@ionic/angular';

@Injectable({
    providedIn: 'root'
})
export class BusyService {
    busyRequestCount = 0;
    loading: any = null;

    constructor(
        private loadingCtrl: LoadingController
        ) { }

    async busy() {
        console.log('busy');
        this.busyRequestCount++;
        if (this.busyRequestCount == 1) {
            const loading = await this.loadingCtrl.create({
                message: 'Loading...'
            });
            await loading.present();
            console.log('present')
            return this.loading = loading;
        }
        return;
    }

    idle() {
        console.log('idle');                                
        this.busyRequestCount--;
        if (this.busyRequestCount <= 0) {
            this.busyRequestCount - 0;
            this.loading.dismiss();
        }
    }
}

and a loading.interceptor.ts

import { HttpInterceptorFn } from '@angular/common/http';
import { inject } from '@angular/core';
import { BusyService } from '../_services/busy.service';
import { delay, finalize, identity } from 'rxjs';
import { environment } from 'src/environments/environment';

export const loadingInterceptor: HttpInterceptorFn = (request, next) => {
    const busyService = inject(BusyService);
    busyService.busy();

    return next(request).pipe(
        (environment.production ? identity : delay(50)),
        finalize(() => {
            console.log('after 50')
            busyService.idle();
        })
        );
};

What I’m trying to achieve is to start the ion-loading when the http starts and dismiss when the response is complete.

Unfortunately the order of events I see in the console log are as follow:

1. busy.service.ts:16 busy

2. loading.interceptor.ts:14 after 50

3. busy.service.ts:30 idle

4. busy.service.ts:23 present

is there a way to tell idle() to wait until the busy() is complete?

Thank you

ion-loading to appear on http request and dismiss on http request completion