Problem with loading

Ionic Framework ionic-v3
1

I have recently updated to beta 10, and since then Loading is creating problems.

Inside getFilters(): when I am calling loading before any modal the modal wouldn’t open, and the whole app gets stuck. when I remove the loding code snippet it would open without any problem

Here is the code i am refering to:

getFilters () {
    let loader = Loading.create({
        spinner: 'crescent',
        duration: 2000
    });
    this.nav.present(loader);
    let modal= Modal.create(Filter, {
      request: this.filterValue
    });

    this.nav.present(modal);

}

also tried dismissing the loader and then opening modal, still wouldn’t work :frowning: It shows the error
TypeError: Cannot read property 'nativeElement' of undefined
modal would not open but later the app keeps working
Is it something that I am doing wrong? why is it happening? Any ideas anyone?
thanks in advance!

2

Try change:

this.nav.present(loader);

to:
setTimeout(()=>{
this.nav.present(loader);
});

3

Thanks @paunadeu for your reply.

I tried that too …

Now just loader would work after a small time(ie, after event loop starts) but still modal was not opened.

4

If you try to debug this.filterValue before create the Model has any value?

console.log(this.filterValue) before let modal …

5

filterValue is initialized on ngOninit
and the values are changed based on user inputs and also inside the modal

6

Yes, but on console.log you got it?

7

yea I’ve tested that … It is console logging both before and after of modal and also loader.

But modal is not opening

8

I implemented Modal without problems. It’s too hard to implement. You need to create class on same TS file.

In main class:
populateChannels(){
let modal = Modal.create(ZapContent, { canals: this.canals, tab: this.tab });
this.nav.present(modal);
}

//ZAP modal
@Component({
templateUrl: ‘build/pages/canals/canals.html’
})

class ZapContent {
public canals: any;
public tab: any;
constructor(private viewCtrl: ViewController, public params: NavParams, public nav:NavController) {
this.canals = this.params.data.canals;
this.tab = this.params.data.tab;
//console.log(this.params.data.canals);
}

itemTapped(event, canal) {
    this.nav.push(Channel, {
    canal: canal,
    tab: this.tab
    });
}

close() {
this.viewCtrl.dismiss();
}
}

9

Thanks so much for your efforts @paunadeu .

Modals normally are working in my case as well … they do not work with loading component

10

Issue opened on https://github.com/driftyco/ionic/issues/7225

Same here.

11

Same problem here so i stopped using loading for now.