Ion-tabs with side menu loading wrong content


#1

I have a side menu application built using Ionic-3, in which two of the views (which can be reached by side menu), have tab in it, implemented through Ion-tabs / Ion-tab.

When I browse to the first tabbed view using first side menu option, it displays everything correctly and all the tabs look good, but if I go to second tabbed view (which has different sets of tabs), the view inside the tabs still loads from the old view.

Debugging into it, I noticed that during second time, when I click the side menu, the rootParams does not get passed correctly, causing this behavior.

I have seen an old post from ionic-V1, where people have run into similar issue, but I wonder if it still exists in Ionic 3.0. Anything I can do to fix this issue.


#2

You have to open up app.components.ts and check if your [root] for tab menu items is set correctly…


#3

Thanks James, but I don’t see any [root] for tab menu item inside app.components.ts.
But I did a redirection hack to solve my problem. I was noticing that tabs are only loaded in a wacky manner if after opening a tabbed view, I go back to the side menu, and open the tabbed view again (same or another).
I introduced a dummy ‘non-tabbed’ page, which is linked with the side menu (instead of the tabbed view), and this dummy page at the time of loading redirects to the tabbed views. Something like this:

private ionViewDidEnter() {
let param = this.navParams.data;
if (param === ‘followGroups’) {
this.navCtrl.setRoot(FollowTabsPage);
}
else if (param === ‘showGroups’) {
this.navCtrl.setRoot(GroupsTabsPage);
}
}

If there is any better approach out there, I would be curious to know, but I am quite fine with current approach too.