mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-21 21:15:24 +08:00
72699dbbb4
Improved which angles should allow the side menu to open, depending if it’s a left or right menu. Also check if the distance of the drag is longer than a side menu would get. For example, scrolling vertically for a long ways would have a long distance, but triggering a side menu to open would be a short distance. Also ensure that a side menu can always be closed incase something goes wrong. Closes #5272
143 lines
3.0 KiB
HTML
143 lines
3.0 KiB
HTML
<ion-menu [content]="content" id="leftMenu" side="left">
|
|
|
|
<ion-toolbar secondary>
|
|
<ion-title>Left Menu</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-content>
|
|
|
|
<ion-list>
|
|
|
|
<button ion-item *ngFor="#p of pages" (click)="openPage(p)">
|
|
{{p.title}}
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="leftMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
</ion-list>
|
|
</ion-content>
|
|
|
|
</ion-menu>
|
|
|
|
|
|
<ion-menu [content]="content" id="rightMenu" side="right">
|
|
|
|
<ion-toolbar danger>
|
|
<ion-title>Right Menu</ion-title>
|
|
</ion-toolbar>
|
|
|
|
<ion-content>
|
|
|
|
<ion-list>
|
|
|
|
<button ion-item *ngFor="#p of pages" (click)="openPage(p)">
|
|
{{p.title}}
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
<button ion-item menuClose="rightMenu" detail-none>
|
|
Close Menu
|
|
</button>
|
|
|
|
</ion-list>
|
|
|
|
</ion-content>
|
|
|
|
</ion-menu>
|
|
|
|
<ion-nav id="nav" [root]="rootView" #content swipe-back-enabled="false"></ion-nav>
|
|
|
|
<div [hidden]="isChangeDetecting()"></div> |