Onsen UI + click and hold listening on mobile devices

Question

Hi, I know that the Onsen user interface has "ons-gesture-detector", but is there another way to listen to the hold event? I would like to avoid creating directives in AngularJS. Tks for any answer. David

Answer 1

ons-gesture-detectorbased on Hammer.JS , which means that it can be used without using the Angular directive.

For example, given that the element in which you want to detect an action holdhas id="element", your code should be something like this.

var myElement = document.getElementById("element");

var onHold = ons.GestureDetector(myElement).on("hold", function(event) {
  alert('hello!');
});

Hammer.JS . Hammer ons.GestureDetector.

, !

Answer 2

onsen.io

:

1 - $interval,

2 - $interval,

3 - $ .

angular.element(document).ready(function(){
    // interval var
    var holding;
    // hold myBtn
    ons.GestureDetector( document.getElementById('myBtn') ).on("hold", function(event) {
        // run $scope.myBtnLogic() every 150 millseconds
        // pass reference ($scope.myBtnLogic), not function call ( $scope.myBtnLogic() )
        holding = $interval($scope.myBtnLogic, 150);
    });
    // release of myBtn
    ons.GestureDetector( document.getElementById('myBtn') ).on("release", function(event) {
        // if there is a holding instance, cancel it
        // release event will fire even on normal clicks so need blocker.
        if(holding){ $interval.cancel(holding); }
    });
});