แก้ไขไฟล์
- src/pages/tabs/tabs.html
- src/pages/tabs/tabs.ts
1. src/pages/tabs/tabs.html
|
1 2 3 4 5 |
<ion-tabs [selectedIndex]="selectedIndex"> <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab> <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="information-circle"></ion-tab> <ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab> </ion-tabs> |
บรรทัดที่ 1: ผูกตัวแปร selectedIndex เข้ากับแท็ฏ ion-tabs
2. src/pages/tabs/tabs.ts
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
import { Component } from '@angular/core'; import { NavParams } from 'ionic-angular'; import { AboutPage } from '../about/about'; import { ContactPage } from '../contact/contact'; import { HomePage } from '../home/home'; @Component({ templateUrl: 'tabs.html' }) export class TabsPage { tab1Root = HomePage; tab2Root = AboutPage; tab3Root = ContactPage; selectedIndex: any; constructor(navParams: NavParams) { this.selectedIndex = navParams.data.tabIndex || 0; } } |
บรรทัดที่ 20: กำหนดหน้า default ที่จะให้แสดง เช่นหน้า 0, 1, 2
Link