Issue with pushing a new page from ion-tabs in ionic2

#1

I have created a sample chat application in which when a user login the application will navigate to a tabs page.

<ion-tabs tabsPlacement="top" color="header" tabsHighlight=true>
  <ion-tab [root]="tab1" tabTitle="Chats" tabIcon="chatbubbles"></ion-tab>
  <ion-tab [root]="tab2" tabTitle="Groups" tabIcon="contacts"></ion-tab>
  <ion-tab [root]="tab3" tabTitle="Profile" tabIcon="contact"></ion-tab>
</ion-tabs>

Capture1
Capture1.PNG364x645 9.73 KB

  1. when I check the current active page from the tabs by console.log(this.navCtrl.getActive().name); I am getting undefined. Could you please tell me why?

  2. When I navigate to a new page by clicking the app icon from the header this.navCtrl.push('FriendsPage');. In the new page when I print the current active page name it shows the previous page name “ChatPage” instead of “FriendsPage”

    Capture
    Capture.PNG364x644 9.42 KB

Please help me with solving this issue.

Thanks and Regards
Anand Raj