2016-01-08 2 views
8

Я пытаюсь использовать Ionic 2, и я по-прежнему борюсь с большинством основных задач, например, выберите вкладку, когда приложение загружается.Выберите конкретную вкладку в Ionic 2

Я попытался ввести контроллер Tabs и позвонить по телефону select на мероприятии onPageLoaded, но безрезультатно.

Может ли кто-нибудь помочь, может быть?

+1

Вам нужно позвонить 'выбрать()' в конструкторе страницы, где определен элемент управления вкладки. К сожалению, у меня нет примера, как получить ссылку на элемент управления. –

+0

Можете рассказать об этом еще немного? –

ответ

6
//importing tabs for manipuling our ion-tabs 
import {Tabs} from 'ionic-angular'; 
@Page({ 
    templateUrl: 'build/pages/page1/page1.html' 
}) 
export class Page1 
{ 
    //provide Angular with metadata about things it should inject in the constructor 
    static get parameters() 
    { 
     return [[Tabs]]; 
    } 
    //after injecting ,passing an instance of [Tabs] in the page constructor 
    constructor(tab) { 
     this.tab = tab; 
    } 
    //"onPageWillEnter" function fires every time a page becomes the active  view. 
    onPageWillEnter() 
    { 
     //make the second tab selected From the first tab (within the current Page 'page1') 
     // 1 IS the index of the target tab 
     this.tab.select(1); 
    } 
} 
+0

Пожалуйста, взгляните на эту ссылку https://webcake.co/page-lifecycle-hooks-in-ionic-2/ –

+0

Добро пожаловать в SO. Пожалуйста, подумайте о том, как объяснить свой код как часть вашего ответа. –

+0

Thaks @RichardErickson, достаточно ли это объяснено? : p –

9

Чтобы по умолчанию на вкладке ионным 2 изменить свойство SelectedIndex:

<ion-tabs [selectedIndex]="1"> 
     <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="rewind"></ion-tab> <!-- Index 0--> 
     <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="md-time"></ion-tab><!-- Index 1 (Selected)--> 
     <ion-tab [root]="tab3Root" tabTitle="Contacts" tabIcon="fastforward"></ion-tab><!-- Index 2--> 
</ion-tabs> 

вкладку О будет вкладка выбрана при загрузке страницы.

1

В ионическом 3 и угловой 4.

import { Tabs } from 'ionic-angular/navigation/nav-interfaces'; 
@ViewChild('myTabs') tabRef: Tabs; - With in the class about constructor. 
this.tabRef.select(0, {}); // In the method where you want set tab.