❮ Ionic Ion Radio Ionic Ion Tabs ❯

Ionic Gesture Events

Event	Description	Usage	Example
on-hold	The hold time is 500 milliseconds.	`<button on-hold="onHold()" class="button">Test</button>`	Try it »
on-tap	This is a gesture tap event. If the hold time exceeds 250 milliseconds, it is not a tap.	`<button on-tap="onTap()" class="button">Test</button>`	Try it »
on-double-tap	Double-tap screen event.	`<button on-double-tap="onDoubleTap()" class="button">Test</button>`	Try it »
on-touch	This is different from on-tap; it executes immediately upon user touch, without waiting for touchend/mouseup.	`<button on-touch="onTouch()" class="button">Test</button>`	Try it »
on-release	Triggered when the user ends the touch event.	`<button on-release="onRelease()" class="button">Test</button>`	Try it »
on-drag	This is somewhat similar to drag events on PC. It triggers when you press and hold an object and start moving.	`<button on-drag="onDrag()" class="button">Test</button>`	Try it »
on-drag-up	Drag up.	`<button on-drag-up="onDragUp()" class="button">Test</button>`	Try it »
on-drag-right	Drag right.	`<button on-drag-right="onDragRight()" class="button">Test</button>`	Try it »
on-drag-down	Drag down.	`<button on-drag-down="onDragDown()" class="button">Test</button>`	Try it »
on-drag-left	Drag left.	`<button on-drag-left="onDragLeft()" class="button">Test</button>`	Try it »
on-swipe	Refers to the finger swipe effect, which can be in any direction. Similar to on-drag, it also has separate events for four directions.	<button <br> on-swipe="onSwipe()" <br> class="button"><br> Test<br></button>	Try it »
on-swipe-up	Upward finger swipe effect.	<button <br> on-swipe-up="onSwipeUp()" <br> class="button"><br> Test<br></button>	Try it »
on-swipe-right	Rightward finger swipe effect.	<button <br> on-swipe-right="onSwipeRight()" <br> class="button"><br> Test<br></button>	Try it »
on-swipe-down	Downward finger swipe effect.	<br> Test<br></button>	Try it »
on-swipe-left	Leftward finger swipe effect.	<button <br> on-swipe-left="onSwipeLeft()"<br> class="button"><br> Test<br></button>	Try it »

$ionicGesture

An Angular service that exposes ionic.EventController gestures.

Methods

on(eventType, callback, $element)

Adds an event listener to an element.

Parameter	Type	Details
eventType	string	The gesture event to listen for.
callback	function(e)	The event to trigger when the gesture occurs.
$element	element	The Angular element to listen for the event.
options	object	An object.

off(eventType, callback, $element)

Removes a gesture event listener from an element.

Parameter	Type	Details
eventType	string	The gesture event to remove.
callback	function(e)	The listener to remove.
$element	element	The Angular element being listened to.

❮ Ionic Ion Radio Ionic Ion Tabs ❯