Loading Controller inside Modal does not work

Ionic Framework ionic-v3
1

Loading Controller inside page works like a charm.
Using Loading Controller inside Modal, however, does not seem to work.

calling modal from a root-page

let modal = this.modalCtrl.create(PreferenceModal, {codUtente: 1 });
modal.present();

calling loading controller from PreferenceModal

ionViewDidLoad() {
    console.log('PreferenceModal Page');
    let loading = this.loadingCtrl.create({
        content: 'Loading data, please wait...'
    });
    loading.present();
}

and loading.dismiss() after some logic.

Apparently, the loading controller remains under the modal view…
Some tips?!

Thanks in advance.

1 Like
2

I was literally just having the same problem… It is caused by the loader displaying before the view.

So the loader is showing up, but it’s actually showing up for the previous screen and sitting behind your modal.

My solution was to put it inside a time out.

 // Loader details
let loading = this.loader.create({
  content: 'Please wait...'
});

setTimeout(() => {
  // Show loader
  loading.present();
}, 100)
2 Likes
3

Uhm is this a bug or something else?

4

Not sure really… You’d assume if you put it in the ViewDidLoad part that it wouldn’t run until the view was shown, but this doesn’t seem to be the case.

Just another note… You will most likely need to wrap the dismiss in a time out with a longer duration than the present so that it doesn’t try to dismiss the loader before it’s been shown.

1 Like
5

Maybe ionViewWillEnter well be better…
Hope this event will only happens once when the page is about to enter and become the active page.

This makes sense.

6

Well @stevenhastie, using ionViewWillEnter() solved the problem too.

1 Like
7

Awesome, I’ll try it tomorrow. Thanks for the update.

1 Like
8

ionViewWillEnter() solved the problem. Cheers!

1 Like