Ionic2 Push Notification Page move

Question

I made Ionic2 App with notification using this plugin https://github.com/phonegap/phonegap-plugin-push. When the users receive the notification, depending on its data, I would like them to move the page accordingly.

I am sending route to additionalData to distinguish which page to guide them. In addition to this, I want to guide the user to specific tab of the page.

Any suggestion or advice would be appreciated!

Thank you in advance.

app.components.ts

declare var TabIndex: any; 

.....

push.on('notification').subscribe((notification:any) => {
    if (notification.additionalData.route == 'order-list') {
        console.log('order-list is selected');
        //WHAT DO I DO? 
        //I want the user to move to TabsPage(parent view) and its second-tab(child view)
    } else if (notification.additionalData.route == 'personal') {
        console.log('personal is selected');
        //I want the user to move to TabsPage and its third-tab
    } 
});

EDITED:

app.components.ts

push.on('notification').subscribe((notification:any) => {
    if (notification.additionalData.AppRoute == 'order-list') {
        console.log('move to orderlist');
        // this.nav.push(TabsPage, {"index" : 1});
        TabIndex = 1;
    } else if (notification.additionalData.AppRoute == 'order-home') {
        console.log('move to home');
        // this.nav.push(TabsPage, {"index" : 0});
        TabIndex = 0;
    }
});

tabs.ts

constructor(private navParams: NavParams) {
    if (TabIndex) {
        this.index = TabIndex;
    }
}

Answer 1

You can have navParams in your Tabs.ts (as in where the tabs are mentioned and in Tabs.html, you set it using <ion-tabs>).

You can send index of tab as navParam to this tabs.ts. Then, use <ion-tabs selectedIndex="2"> in this page.

tabs.ts:

export TabsPage{
  index = 1;
  constructor(private navParams: NavParams){
    // This if() is for other cases where you don't want to send navParams. Like normally setting this page and selectedTab to 1.
    if(this.navParams.data.index !== undefined){
      index = this.navParams.data.index;
    }
  }
}

tabs.html :

<ion-tabs selectedIndex={{index}}>
  <ion-tab>..</ion-tab>
  ...
</ion-tabs>

And app.component.ts:

push.on('notification').subscribe((notification:any) => {
  if (notification.additionalData.route == 'order-list') {
    console.log('order-list is selected');
    this.nav.push(TabsPage, {"index" : 2});
  } else if (notification.additionalData.route == 'personal') {
    console.log('personal is selected');
    this.nav.push(TabsPage, {"index" : 3});
  } 
});