create tabs in page - ionic2

Question

I would like to create tabs like these on a page:
As you see Voortgang and pijnniveau are my tabs in the page itself but if I set them like this:
export class ProgressPage {
tab1Root = HomePage;
tab2Root = SchemaPage;
and than in my html template do this:
<ion-header>
<ion-navbar color="light">
<ion-title>{{viewTitle}}</ion-title>
<ion-buttons end>
<button ion-button [disabled]="isToday" (click)="today()">Today</button>
<button ion-button (click)="changeMode('month')">M</button>
<button ion-button (click)="changeMode('week')">W</button>
<!--<button ion-button (click)="changeMode('day')">D</button>-->
<button ion-button (click)="loadEvents()">Load Events</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content class="has-header">
<!--<template #template let-showEventDetail="showEventDetail" let-selectedDate="selectedDate" let-noEventsLabel="noEventsLabel"></template>-->
<calendar [eventSource]="eventSource"
[calendarMode]="calendar.mode"
[currentDate]="calendar.currentDate"
(onCurrentDateChanged)="onCurrentDateChanged($event)"
(onEventSelected)="onEventSelected($event)"
(onTitleChanged)="onViewTitleChanged($event)"
(onTimeSelected)="onTimeSelected($event)"
step="30">
</calendar>
<ion-list inset>
<ion-list-header>{{ viewTitle }}</ion-list-header>
<ion-item>
<h3>Frans van Brugge <span class="date">9 juni 2017</span></h3>
<p>Fysiotherapie afsrpaak</p>
</ion-item>
<ion-item>
<h3>Frans van Brugge <span class="date">9 juni 2017</span></h3>
<p>Fysiotherapie afsrpaak</p>
</ion-item>
</ion-list>
</ion-content>
<ion-tabs color="light" tabsPlacement="top">
<ion-tab [root]="tab1Root" tabTitle="Missies"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Beloningen"></ion-tab>
</ion-tabs>
But this will looks like this, you see the tabRoot pages under the active page:
How can I fix this?

Answer 1

Kindly go to your app.componet.ts file and set the rootPage to ProgressPage. (If this is the opening screen of your app)
If you are using a login screen or if you are navigating from another screen to this screen, then ensure that you are pushing the ProgressPage in the navCtrl.
Hope this helps you. Thanks.