Ionic 4: “Loading Controller” dismiss() is called before present() which will keep spinner without dismissing

Question

I used \"Ionic Loading Controller\" to show a spinner until the data is retrieved then it calls \"dismiss()\" to dismissed it. it works fine, but sometimes when the app alre

Answer 1

This onDidDismiss() event should created after .present() function called.

Example:

this.loader.present().then(() => {
            this.loader.onDidDismiss(() => {
                console.log('Dismiss');
            })
        });

Answer 2

I found a new way to do this. I hope it help! It’s using the id of loading. So if you have many loadings you don’t want to dismiss wrong loading.

In the service:

async showLoading(loadingId: string, loadingMessage: string = 'Loading...') {
            const loading = await this.loadingCtrl.create({
              id: loadingId,
              message: loadingMessage,
              spinner: 'circles'
            });
            return await loading.present();
}

async dismissLoader(loadingId: string) {
  return await this.loadingCtrl.dismiss(null, null, loadingId).then(() => console.log('loading dismissed'));
}

In the component calling the loading:

await this.globalVars.showLoading('ifOfLoading')

Dismissing the loading:

this.globalVars.dismissLoader('ifOfLoading')