”;
Various Ionic events can be used to add interactivity with users. The following table explains all the Ionic events.
| Event Name | Event Detail |
|---|---|
| on-hold | Called when duration of the touch is more than 500ms. |
| on-tap | Called when duration of the touch is less than 250ms. |
| on-double-tap | Called when there is double tap touch. |
| on-touch | Called immediately when touch begins. |
| on-release | Called when touch ends. |
| on-drag | Called when touch is moved without releasing around the page in any direction. |
| on-drag-up | Called when element is dragged up. |
| on-drag-right | Called when the element is dragged to the right. |
| on-drag-left | Called when the element is dragged to the left. |
| on-drag-down | Called when the element is dragged down. |
| on-swipe | Called when any dragging has high velocity moving in any direction. |
| on-swipe-up | Called when any dragging has high velocity moving up. |
| on-swipe-right | Called when any dragging has high velocity moving to the right. |
| on-swipe-left | Called when any dragging has high velocity moving to the left. |
| on-swipe-down | Called when any dragging has high velocity moving down. |
Using Events
Since all the Ionic events can be used the same way, we will show you how to use the on-touch event and you can just apply the same principles to the other events. To start with, we will create a button and assign an on-touch event, which will call the onTouchFunction().
<button on-touch = "onTouchFunction()" class="button">Test</button>
Then we will create that function in our controller scope.
$scope.onTouchFunction = function() {
// Do something...
}
Now, when touch event occurs the onTouchFunction() will be called.
Advertisements
”;