2017-08-21 6 views
1

ionic2/3のタブからサイドバーメニューを開こうとしています(リンクされた画像を参照)。 解決策を見つけることができませんでした。 がすでにionic1上questionではなく、私はそこに私のcomponent.ts中からナビゲートする機能をコンポーネント名を交換しようとしたタブからイオン性のサイドメニューを開く

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabTitle="page1" tabIcon="someicon"></ion-tab> 
    <ion-tab [root]="tab2Root" tabTitle="page2" tabIcon="someicon"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="page3" tabIcon="someicon"></ion-tab> 
    <ion-tab [root]="tab4Root" tabTitle="page4" tabIcon="someicon"></ion-tab> 
</ion-tabs> 

2版ですが、それは動作しません。

tab1Root = page1; 
    tab2Root = page2; 
    tab3Root = page3; 
    tab4Root = this.functionToToggleSidemenu; 
    functionToToggleSidemenu(){ 
    //here i have placed the navigation code 
    } 

open sidemenu from tab desired output screenshot

答えて

0

あなたはthe docsで見ることができるだけのように:

時々、あなたが代わりに新しい ページにナビゲートする方法を呼び出したいことがあります。タブが選択されている場合、(ionSelect)イベントを使用して、 クラスのメソッドを呼び出すことができます。

<ion-tabs> 
    <ion-tab (ionSelect)="openSideMenu()" tabTitle="Sidemenu"></ion-tab> 
</ion-tabs> 

およびコンポーネント・コード

import { Component } from '@angular/core'; 
import { MenuController } from 'ionic-angular'; 

Component({...}) 
export class TabsPage { 

    // ... 

    constructor(public menuCtrl: MenuController) {} 

    openSideMenu() { 
    this.menuCtrl.open(); 
    } 
} 

でそれを行うための別の方法は、へmenuToggleディレクティブを追加することです:それはこのようなものになるだろう

タブボタンを直接操作していましたが、AFAIKでは以前のバージョンのIonicでバグが発生していました。 e正直)。ここには、MenuToggle docs

<ion-tabs> 
    <ion-tab menuToggle tabTitle="Sidemenu"></ion-tab> 
</ion-tabs> 
があります。
関連する問題