How to dismiss loading overlay component


I have a list in my ionic2 typescript application. When a list item is clicked I run the following code:

let loading = Loading.create({
    content: 'Opening detail page...',
    dismissOnPageChange: false // I don't want to dismiss on page change
this.nav.present(loading).then(() => {
    this.nav.push(DetailPage,{id: id}); // nav to detail page

Next, on my DetailPage I want to do something like this:

ionViewDidEnter() {
    // 3.5 seconds timeout
    setTimeout(() => {
    }, 3500); 

Obviously, this produces an error:

EXCEPTION: ReferenceError: loading is not defined

How can I do that?

Thanks and sorry for my bad english.

There is a related topic:

your detail page doesn’t know anything about your loading overlay

you could create a service which shares the loading instance so you can inject the service in your detail page and dismiss it.

or you make something like that:

this.nav.push(DetailPage,{id: id, loading: loading});

and call loading dismiss through navParams.get(‘loading’).dismiss()


I had not thought about do it that way. It works well.

Thanks for your quick reply @bengtler !