Using backwards and forwards to navigate through dynamic tabs

@jwoodward86 wrote:

Hello,

I am trying to navigate through dynamic ion tabs using a backwards and forwards tab.

In my tabs.ts page constructor:

      this.tabs = [
        { root: TabRootZones, tabTitle: values['TAB_TITLE_ZONES'], show: true, index: 0, tabIcon: 'home' },
        { root: TabRootMetering, tabTitle: values['TAB_TITLE_METERING'], show: true, index: 1, tabIcon: 'speedometer' },
        { root: TabRootLights, tabTitle: values['TAB_TITLE_LIGHTS'], show: true, index: 2, tabIcon: 'bulb' },
        { root: TabRootIntruder, tabTitle: values['TAB_TITLE_INTRUDER'], show: true, index: 3, tabIcon: 'lock' },
        { root: TabRootAccess, tabTitle: values['TAB_TITLE_ACCESS'], show: true, index: 4, tabIcon: 'key' },
        { root: TabRoomBooking, tabTitle: values['TAB_TITLE_BOOKING'], show: false, index: 5, tabIcon: 'time' },
        { root: TabRootSensors, tabTitle: values['TAB_TITLE_SENSORS'], show: false, index: 6, tabIcon: 'thermometer' },
        { root: TabRootZigbee, tabTitle: values['TAB_TITLE_ZIGBEE'], show: false, index: 7, tabIcon: 'wifi' },
        { root: TabRootLocation, tabTitle: values['TAB_TITLE_LOCATION'], show: false, index: 8, tabIcon: 'globe' },
        { root: TabRootSpeech, tabTitle: values['TAB_TITLE_SPEECH'], show: false, index: 9, tabIcon: 'chatbubbles' }
      ];

      this.tabTitleMoreBack = values['TAB_TITLE_MORE'];
      this.tabTitleMoreForward = values['TAB_TITLE_MORE'];

tabs.html:

<ion-tabs color="dark">
  <ion-tab [tabTitle]="tabTitleMoreBack" [show]="false" tabIcon="arrow-back" (ionSelect)="tabBack()"></ion-tab>
  <ion-tab *ngFor="let tab of tabs" [root]="tab.root" [tabTitle]="tab.tabTitle" [show]="tab.show" [tabIcon]="tab.tabIcon"></ion-tab>
  <ion-tab [tabTitle]="tabTitleMoreForward" [show]="true" tabIcon="arrow-forward" (ionSelect)="tabForward()"></ion-tab>
</ion-tabs>

If I remove the ion-tab “tabTitleMoreForward” and “tabTitleMoreBack” then it will display but with it there I just get a white page and no error?

Posts: 1

Participants: 1

Read full topic