Angular detect if swiped over a div

Question

I want to detect when user swipes with his finger or with the mouse pointer over a div.

<ul>
    <li ng-repeat="x in names">
      <div ngTouchOrMouseOver="saveName(x) ">{{ x }}</div>
    </li>
  </ul>

Is it possible to implement something like ngTouchOrMouseOver in angular? So when I move my finger over the screen and it happens to be within bounds of a div, I want to execute some code.

Edit:

Found this: How to Capture Touch Events with Angular Directive

Apparantly it works for mousemove but not for touchmove. Nothing new in the three years after the question was asked?

score 1 · Answer 1 · answered Jan 25 '16 at 18:02

AngularJS has Swipe Left and Swipe Right Directive and $scope Service.

The $swipe service is a service that abstracts the messier details of hold-and-drag swipe behavior, to make implementing swipe-related directives more convenient.

Directive:
https://docs.angularjs.org/api/ngTouch/directive/ngSwipeLeft
https://docs.angularjs.org/api/ngTouch/directive/ngSwipeRight

Services:
https://docs.angularjs.org/api/ngTouch/service/$swipe

(function(angular) {
  'use strict';
   angular.module('ngSwipeLeftExample', ['ngTouch']);
})(window.angular);

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.1/angular.min.js"></script>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.1/angular-touch.js"></script>
<body ng-app="ngSwipeLeftExample">
  <div ng-show="!showActions" ng-swipe-left="showActions = true">
  Some list content, like an email in the inbox
</div>
<div ng-show="showActions" ng-swipe-right="showActions = false">
  <button ng-click="reply()">Reply</button>
  <button ng-click="delete()">Delete</button>
</div>
</body>

Angular detect if swiped over a div

1 Answers1