2017-04-09 8 views
1

Um einen Schalter auf eine Seite zu setzen, verwenden wir menuToggle Director. Aber wenn ich zwei oder drei Menüs in eine Seite einfügen möchte, was soll ich tun? Auf der anderen Seite, wie die Umschalttaste einer Taste erkennt, welches Menü beim Klicken geöffnet werden soll?Wie Umschalttaste an Menüs binden?

Hinweis: Diese question beschreibt nicht, wie Toggle funktioniert, es sagt nur über menuToggle="right" oder menuToggle="left". Aber wenn ich zwei Menü links habe, was soll ich Code schreiben, um Button und Menü zusammen zu binden?

Menü 1:

<ion-nav #mycontent [root]="rootPage"></ion-nav> 
    <button ion-button menuToggle="left">Toggle Menu</button> 

    <ion-menu [content]="mycontent"> 
    <ion-content> 
     <ion-list> 
     <p>some menu content</p> 
     </ion-list> 
     <ion-list> 
     <ion-item menuClose detail-none>Close Menu</ion-item> 
     </ion-list> 
    </ion-content> 
    </ion-menu> 

Menü 2:

<button ion-button menuToggle="left">Toggle Menu2</button> 

    <ion-menu [content]="mycontent" side="right"> 
    <ion-content> 
     <ion-list> 
     <p>some menu content 2</p> 
     </ion-list> 
     <ion-list> 
     <ion-item menuClose detail-none>Close Menu2</ion-item> 
     </ion-list> 
    </ion-content> 
    </ion-menu> 

Menü 3:

<button ion-button menuToggle="right">Toggle Menu2</button> 

    <ion-menu [content]="mycontent" side="right"> 
    <ion-content> 
     <ion-list> 
     <p>some menu content 3</p> 
     </ion-list> 
     <ion-list> 
     <ion-item menuClose detail-none>Close Menu2</ion-item> 
     </ion-list> 
    </ion-content> 
    </ion-menu> 
+1

Mögliches Duplikat [Ionic 2 - Mehrere Menü zur gleichen Zeit (rechts - links)] (http://stackoverflow.com/questions/40802202/ionic-2-multiple-menu-zur-gleich-Zeit-rechts-links) –

+0

@suraj Es ist nur ein Beispiel. Ich möchte den Mechanismus von Menüs in ionic2 kennen, um komplexe zu erstellen. Zum Beispiel, wenn ich 2 Menü links und eins rechts habe, wie soll ich es machen? –

+0

Funktioniert 'menuToggle =" menuId "' oder 'menuOpen =" menuId'? Keine Zeit um ATM zu überprüfen – Ivaro18

Antwort

0

Zuerst versuchen, die ID zu einer Toggle-Option Bindung wie so

<ion-menu id="menu1"> und <button menuToggle="menu1"> OR <button menuOpen="menu1">


Wenn, dass Sie die folgende Abhilfe MenuController (https://ionicframework.com/docs/api/components/menu/MenuController/)

mit verwenden nicht funktioniert

Wenn Sie

<ion-menu id="menu1"> und <ion-menu id="menu2"> Sie auf eine Schaltfläche machen mit ids 2 Menüs haben dann

<button (click)="openMenu('menu1')">Open menu 1</button>

Und in Ihrem ts nur Ihre menuController erstellen und das ausgewählte Menü öffnen

constructor(public menuCtrl: MenuController) {} 

openMenu(menuId: string) { 
    this.menuCtrl.open(menuId); 
} 

closeMenu(menuId: string) { 
    this.menuCtrl.close(menuId); 
}