Back button doesn't work correctly in tab page


Hi! I have an issue,i try to explain in simple way:
have two pages.
page1(no tabs)----->page2(with 3 tabs)

here the main-html of the tabs

  <ion-tabs class="TabsTop" tabsPlacement="top" selectedIndex="1">
   <ion-tab tabTitle="Evento" [root]="eventInfo" [rootParams]="event"></ion-tab>
    <ion-tab tabTitle="Artisti" [root]="artists" [rootParams]="event"></ion-tab>
    <ion-tab tabTitle="Location" [root]="location" [rootParams]="event"></ion-tab>


   header here
   content here


   header here
   content here


   header here
   content here

these 3 tabs have 3 different header because i need to have different icon on the header for each tab( different function,different behaviour)
when i go to page 2 my back button is disappeared,in EVERY tab.I think the problem is that every tab has its own navcontroller.
if i inspect html and i find the back button if i put display block,the back button appears but when i click to it i get this error.


While in the console i get

nav-controller-base.js:375 You can't remove all the pages in the navigation stack. nav.pop() is probably called too many times. Tab {_config: Config, _elementRef: ElementRef, _renderer: RendererAdapter, _componentName: undefined, parent: Tabs, …} <ion-tab role=​"tabpanel" tabtitle=​"Artisti" ng-reflect-root=​"function ArtistsTabPage(app, n" ng-reflect-root-params=​"[object Object]​" ng-reflect-tab-title=​"Artisti" id=​"tabpanel-t2-1" aria-labelledby=​"tab-t2-1" class=​"show-tab" aria-hidden=​"false">​…​</ion-tab>​
NavControllerBase._postViewInit @ nav-controller-base.js:375
(anonymous) @ nav-controller-base.js:260
t.invoke @ polyfills.js:3
onInvoke @ core.js:4760
t.invoke @ polyfills.js:3 @ polyfills.js:3
(anonymous) @ polyfills.js:3
t.invokeTask @ polyfills.js:3
onInvokeTask @ core.js:4751
t.invokeTask @ polyfills.js:3
r.runTask @ polyfills.js:3
o @ polyfills.js:3
e.invokeTask @ polyfills.js:3
p @ polyfills.js:2
v @ polyfills.js:2

How can i solve this?
thanks in advice!


Hi @Bboypluss, Can you tell which page is assigned as rootPage in your app.component.ts?


another page called homepage,that has nothing to do with my issue (i think LOL)
in which i do a control :
if is the first visit i show an intro ,
else i show a login page.


LOL well it really has nothing to do. I was just wondering about that. Hope you get required help!


I think it might have something to do with your issue.

Try using your ‘TabsPage’ as your root page and see if everything works as expected:

  public rootPage: any = 'TabsPage';


Do you:

@ViewChild(Nav) private nav: Nav;