diff --git a/ionic/components/menu/menu.ts b/ionic/components/menu/menu.ts
index 29b8657d3e..cb5f57615f 100644
--- a/ionic/components/menu/menu.ts
+++ b/ionic/components/menu/menu.ts
@@ -96,7 +96,8 @@ import {MenuType} from './menu-types';
host: {
'role': 'navigation',
'[attr.side]': 'side',
- '[attr.type]': 'type'
+ '[attr.type]': 'type',
+ '[attr.swipeEnabled]': 'swipeEnabled'
},
template: '
',
directives: [forwardRef(() => MenuBackdrop)]
@@ -107,9 +108,10 @@ export class Menu extends Ion {
private _gesture: Gesture;
private _targetGesture: Gesture;
private _type: MenuType;
-
+
isOpen: boolean = false;
isEnabled: boolean = true;
+ isSwipeEnabled: boolean = true;
backdrop: MenuBackdrop;
onContentClick: EventListener;
@@ -117,8 +119,9 @@ export class Menu extends Ion {
@Input() id: string;
@Input() side: string;
@Input() type: string;
+ @Input() swipeEnabled: string;
@Input() maxEdgeStart;
-
+
@Output() opening: EventEmitter = new EventEmitter();
constructor(
@@ -150,6 +153,10 @@ export class Menu extends Ion {
}
self._renderer.setElementAttribute(self._elementRef, 'side', self.side);
+ if (self.swipeEnabled === 'false') {
+ self.isSwipeEnabled = false;
+ }
+
if (!self.id) {
// Auto register
self.id = self.side + 'Menu';
@@ -244,7 +251,7 @@ export class Menu extends Ion {
*/
setProgressStart() {
// user started swiping the menu open/close
- if (this._isPrevented() || !this.isEnabled) return;
+ if (this._isPrevented() || !this.isEnabled || !this.isSwipeEnabled) return;
this._before();
@@ -256,7 +263,7 @@ export class Menu extends Ion {
*/
setProgess(value) {
// user actively dragging the menu
- if (this.isEnabled) {
+ if (this.isEnabled && this.isSwipeEnabled) {
this._prevent();
this._getType().setProgess(value);
this.opening.next(value);
@@ -268,7 +275,7 @@ export class Menu extends Ion {
*/
setProgressEnd(shouldComplete) {
// user has finished dragging the menu
- if (this.isEnabled) {
+ if (this.isEnabled && this.isSwipeEnabled) {
this._prevent();
this._getType().setProgressEnd(shouldComplete).then(isOpen => {
this._after(isOpen);
@@ -371,6 +378,16 @@ export class Menu extends Ion {
return this;
}
+ /**
+ * Used to enable or disable the ability to swipe open the menu.
+ * @param {boolean} shouldEnable True if it should be swipe-able, false if not.
+ * @return {Menu} Returns the instance of the menu, which is useful for chaining.
+ */
+ swipeEnable(shouldEnable) {
+ this.isSwipeEnabled = shouldEnable;
+ return this;
+ }
+
/**
* @private
*/
diff --git a/ionic/components/menu/test/disable-swipe/index.ts b/ionic/components/menu/test/disable-swipe/index.ts
new file mode 100644
index 0000000000..ce49ee2598
--- /dev/null
+++ b/ionic/components/menu/test/disable-swipe/index.ts
@@ -0,0 +1,35 @@
+import {App, IonicApp, Page, NavController} from 'ionic/ionic';
+
+@Page({
+ templateUrl: 'page1.html'
+})
+class Page1 {
+ leftMenuSwipeEnabled: boolean = true;
+ rightMenuSwipeEnabled: boolean = false;
+
+ constructor(app: IonicApp) {
+ this.app = app;
+ }
+
+ toggleLeftMenuSwipeable() {
+ this.leftMenuSwipeEnabled = !this.leftMenuSwipeEnabled;
+
+ this.app.getComponent('leftMenu').swipeEnable(this.leftMenuSwipeEnabled);
+ }
+
+ toggleRightMenuSwipeable() {
+ this.rightMenuSwipeEnabled = !this.rightMenuSwipeEnabled;
+
+ this.app.getComponent('rightMenu').swipeEnable(this.rightMenuSwipeEnabled);
+ }
+}
+
+
+@App({
+ templateUrl: 'main.html'
+})
+class E2EApp {
+ constructor() {
+ this.rootView = Page1;
+ }
+}
diff --git a/ionic/components/menu/test/disable-swipe/main.html b/ionic/components/menu/test/disable-swipe/main.html
new file mode 100644
index 0000000000..d43eb3fed4
--- /dev/null
+++ b/ionic/components/menu/test/disable-swipe/main.html
@@ -0,0 +1,40 @@
+
+
+
+
+
+
diff --git a/ionic/components/menu/test/disable-swipe/page1.html b/ionic/components/menu/test/disable-swipe/page1.html
new file mode 100644
index 0000000000..3439f434db
--- /dev/null
+++ b/ionic/components/menu/test/disable-swipe/page1.html
@@ -0,0 +1,33 @@
+
+
+
+
+
+ Main
+
+
+
+
+
+
+
+
+ Page 1
+
+ Left Menu Swipe Enabled: {{ leftMenuSwipeEnabled }}
+
+
+
+
+
+ Right Menu Swipe Enabled: {{ rightMenuSwipeEnabled }}
+
+
+
+
+
+