Loading controller .dismiss()

Ionic Framework ionic-v3
1

Im sure Im missing something simple.

I have a subscription that returns a boolean. When I subscribe to it the first time, the loading boolean is ‘true’ but when the loading is completed, it return ‘false’.

So why does my loading screen not disappear?

ngOnInit() { 
    this.isLoading$ = this.store.let(fromRoot.getIaReportsIsLoading);
    this.isLoading$.subscribe((currentLoading: boolean) => {
        this.presentLoading(currentLoading)
    })
}

 presentLoading(isLoading: boolean) {
    let loader = this.loadingCtrl.create({
        content: "Please wait while we load all Interaction Reports and Clients for you...",
    });
    console.log('currentLoading', isLoading)
    isLoading ? loader.present() : loader.dismiss();

Edit: I changed the scope of the loading controller, but this did nothing for the dismissal behaviour.

 presentLoading(isLoading: boolean) {
    this.loader = this.loadingCtrl.create({
        content: "Please wait while we load all Interaction Reports and Clients for you...",
    });
    console.log('currentLoading', isLoading)
    isLoading ? this.loader.present() : this.loader.dismiss();
};

Everything else is the same

EDIT2: Im almost positive that this is context issue. So I tried this:

ngOnInit() { 
    this.isLoading$ = this.store.let(fromRoot.getIaReportsIsLoading);
    this.presentLoading();
};

 presentLoading() {
    this.isLoading$.subscribe((currentLoading: boolean) => { 
        let loader = this.loadingCtrl.create({
            content: "Please wait while we load all Interaction Reports and Clients for you...",
        });
        console.log('currentLoading', currentLoading)
        currentLoading ? loader.present() : loader.dismiss();
    });
};

And that didn’t work.

I know that currentLoading is initially ‘true’ and then after loading is finished, it turns to ‘false’. And I know that the conditional is firing properly, but the loader.dismiss() is not closing the loader. Am I creating another instance unintentionally that I need to close as well?

2

Anybody here with experience in Loading Controller tied to an observable boolean value?

3

Try loader.dismissAll() instead of dismiss()

4

Why not maybe trying the “contrary” (something like following)?

loader.present().then(() => {
  this.isLoading$.subscribe((currentLoading: boolean) => {
      loader.dismiss();
  });
});
5

Thanks all for the help @reedrichards and @garrykapoor! I got it working with this:

ngOnInit() { 
    this.initLoader();
    this.isLoading$ = this.store.let(fromRoot.getIaReportsIsLoading);
    this.isLoading$.subscribe((currentLoading: boolean) => { 
        currentLoading ? this.presentLoader() : this.closeLoader()
    });
};

initLoader(){
    this.loader = this.loadingCtrl.create({
        content: "Please wait while we load all Interaction Reports and Clients for you...",
    });
};
presentLoader() {
    this.loader.present()
};
closeLoader(){
    this.loader.dismiss();
}
6

In my case the loader was dismissing even before the operation was complete.
I need to show loader till the operation was ended, please suggest me.

Below is my code

downloadSites(SitesDetails) {
let loader = this.loadingctrl.create({
      content: 'Please wait while we load all Interaction Reports and Files for you...'
    });
 loader.present().then(() => {
 if (SitesDetails != null) {
//my code here
}
});
loader.dismiss();
}
7

got this issue solved by declaring var loading=this.loading