After setRoot(TabsPage), the default tab page appears twice

[chanphillip]

I think I found a fix!

I was trying to solve another problem after upgrading to RC4…

Anyone have async rendering problems with RC4

After upgrading to RC4, some of my pages didn’t render after async operations. I can’t show my code here since there are nested functions. But basically I use Observable to retrieve ajax and then show it on the page. I can see the code is all executed and console.log shows the updated variables, but the page didn’t re-render. Any ideas? Or is there a way to force it re-render?

Then I realized the rendering issue happened only on all the tabs at the first level.
So I tried using NgZone to run setRoot(TabsPage)
And some how it solves both the problems…

FYI:

import { NgZone } from '@angular/core';

constructor(private zone: NgZone) { ... }

Where you call setRoot:

this.zone.run(() => {
    this.navCtrl.setRoot(TabsPage);
});