Ionic 2のタブページのsetRoot

Question

私は2つのマップを持っています。各マップは独自の視点で表示されます。私はタブを使って視点から視点にジャンプしています。しかし、このナビゲーション・メソッドを使用すると、ルートが設定されておらず、ページが訪問されるとそのページはプッシュまたはポップまたは設定されません。これは私が使用しているGoogleマップの問題です。この機能は、メニュー領域にルートが設定された通常のメニューを使用しているときには発生しないようです。助けてください。ありがとう。

tabs.html

<ion-tabs> 
    <ion-tab [root]="tab1Root" [tabTitle]="tab1Title"></ion-tab> 
    <ion-tab [root]="tab2Root" [tabTitle]="tab2Title"></ion-tab> 
</ion-tabs> 

tabs.tsコードでタブ間のナビゲーションについて

export class TabsPage { 
    tab1Root: any = Tab1Root; 
    tab2Root: any = Tab2Root; 

    tab1Title = "title1"; 
    tab2Title = "title2"; 

    constructor(public navCtrl: NavController) { 

    } 

} 

Answer 1

、あなたはこのようにそれを行うことができます。 Tabsのselect(index|tab)メソッドを使用する必要があります。あなたのタブページにTabsの参照を得ることができます。

Tabsインスタンスへの参照を取得するために @ViewChild('theTabs') tabRef: Tabsを使用してコンポーネントで次に

<ion-tabs #theTabs selectedIndex="{{tabIndexNum}}" class="customer-tab"> 
    <ion-tab [root]="tab1Root" [tabsHideOnSubPages]="true"></ion-tab> 
    <ion-tab [root]="tab2Root"[tabsHideOnSubPages]="true"></ion-tab> 
</ion-tabs> 

、などです。

[更新]
Googleマップの場合、イオンのようなSPAで使用するには、コンポーネントのinit関数でinitメソッドを呼び出す必要があります。

Answer 2

用のファイルmenu.ts（app.ts）の例以下の

tabs.html

<ion-tabs [selectedIndex]="mySelectedIndex"> 
    <ion-tab [root]="tab1Root" [tabTitle]="tab1Title"></ion-tab> 
    <ion-tab [root]="tab2Root" [tabTitle]="tab2Title"></ion-tab> 
</ion-tabs> 

tabs.ts

import { NavParams } from 'ionic-angular'; 

export class TabsPage { 
    tab1Root: any = Tab1Root; 
    tab2Root: any = Tab2Root; 

    tab1Title = "title1"; 
    tab2Title = "title2"; 

    constructor(navParams: NavParams) { 
    this.mySelectedIndex = navParams.data.tabIndex || 0; 
    } 

} 

追加次のコードを使用してくださいナビゲーション

openPage(page) { 
    let params = {}; 

    if (page.index) { 
     params = { tabIndex: page.index }; 
    } 
} 

私はあなたのためにその仕事を願っています。