menu-tabs.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';


@IonicPage({
  name: 'menu-tabs-page'
})
@Component({
  selector: 'page-menu-tabs',
  templateUrl: 'menu-tabs.html',
})
export class MenuTabsPage {

  tab1Root : any = 'home-page';
  tab2Root : any = 'tarjeta-page';
  tab3Root : any = 'establecimientos-page';
  tab4Root : any = 'listado-ofertas-page';
  showTabs: boolean = true;
  myIndex : number;
  constructor( public navParams: NavParams) {
    this.myIndex = this.navParams.data.tabIndex || 0;

  }

  hideTabs() {
    this.showTabs = false;
  }

}

tabs.html

<ion-tabs [selectedIndex]="myIndex" *ngIf="showTabs">
  <ion-tab  [root]="tab1Root" tabTitle="Inicio" tabIcon="home" (ionSelect)="hideTabs()"></ion-tab>
  <ion-tab  [root]="tab2Root" tabTitle="Tarjeta" tabIcon="card"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="Comercios" tabIcon="basket"></ion-tab>
  <ion-tab [root]="tab4Root" tabTitle="Ofertas" tabIcon="pricetag"></ion-tab>
</ion-tabs>