bug: Dynamically setting entry page after promises

[lordgreg]

Type: bug

Ionic Version: 2.x

Platform: all

You can currently set your entry page in constructor of your @app like this:

  constructor(private app: IonicApp, private platform: Platform) {
    if (this.value) {
      this.rootPage = GettingStartedPage
    } else {
      this.rootPage = ListPage
    }
    this.initializeApp();
    this.pages = [
      { title: 'Getting Started', component: GettingStartedPage },
      { title: 'List', component: ListPage }
    ];

  }

However, having a calculation on which you need to end a bit before it ends and then showing entry page will not work. Take this for example:

  constructor(private app: IonicApp, private platform: Platform) {
    setTimeout(() => {
      if (this.value) {
        this.rootPage = GettingStartedPage
      } else {
        this.rootPage = ListPage
      }

    }, 2000);
    this.initializeApp();
    this.pages = [
      { title: 'Getting Started', component: GettingStartedPage },
      { title: 'List', component: ListPage }
    ];

  }

This will show blank page since the constructor was loaded asynchronously and didn't wait for setTimeout (can also be a Promise or anything else) to be finished.

There also isn't any possible way to do this. As we could do using Ionic1 and Angular1 where you could simply add resolve part into abstract part of your route.

The only "workaround" at the moment is, to always show ListPage, then after our function in constructor is done, use nav.setRoot(GettingStartedPage) which isn't actually the most "smooth" or proper way in this usecase. More of a workaround for now...

[adamdbradley]

I can update the root property to ensure it listens for changes after the ion-nav has initialized. However, not showing a page at all, and using nav.setRoot() when you do load is actually a good idea. If you're changing up the navigation stack dynamically over time, it's best to be explicit about what you're changing, rather than updating a property, that actually does the same thing.

[adamdbradley]

Additionally, when you're using setRoot yourself, you have more control of passing data to the page, knowing when the transition has ended, passing in options to the animation and transition, etc.