Nav controller was destroyed with ionic 3 lazy loading


#1

I have problem with lazy loading and using split-pane’s menu.

My app has root page in app.component.ts (code below) where rootPage set to LoginPage by default and after login’s check it change to MenuPage. Menu Page has <ion-split-pane> with own <ion-nav> directive (code below). At this point I get error:

ERROR Error: Uncaught (in promise): nav controller was destroyed
at c (polyfills.js:3)
at Object.reject (polyfills.js:3)
at NavControllerBase._fireError (nav-controller-base.js:318)
at NavControllerBase._failed (nav-controller-base.js:297)
at nav-controller-base.js:361
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.es5.js:4149)
at t.invoke (polyfills.js:3)
at r.run (polyfills.js:3)
at polyfills.js:3

If I change default page to MenuPage all works greats and other pages open without errors! If I change rootPage after login’s check to page without ion-nav or split-pane also all works great! How can I fix this?

app.component.ts:

@Component({
  template: `<ion-nav #root [root]="rootPage"></ion-nav>`
})

export class IonicApp {

  @ViewChild(Nav) nav: Nav;
  rootPage: any = 'LoginPage'; // rootPage: any = MenuPage' works great

  constructor(public user: User) {
    this.checkLogin();
  }

  checkLogin() {
    this.user.checkLogin()
      .map(res => res.json())
      .subscribe(res => {
        if (res.success)
          this.rootPage = 'MenuPage'; // this.nav.setRoot('MenuPage') also not work but this.rootPage = 'BuyPage' works!
      }, err => {
        //console.error('ERROR', err);
      });
  }
}

menu.html:

<ion-split-pane>
  <ion-menu [content]="content">
    <ion-list>
    	<ion-item *ngFor="let p of pages" menuClose detail-none (click)="openPage(p)">
	    	<ion-icon name="{{p.icon}}" item-start></ion-icon>
        {{p.title}}
      </ion-item>
    </ion-list>
  </ion-menu>

  <ion-nav #content main [root]="rootPage"></ion-nav>
</ion-split-pane>

menu.ts:

export class MenuPage {

  @ViewChild('content') nav: Nav;
  rootPage: any = 'AdvertsPage';

...
}

#2

Many people has similar issue: https://github.com/ionic-team/ionic/issues/11454 Can u help us? Solutions from this link doesn’t work.