Improve this Doc View Source

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.

Requires the `ngTouch` module to be installed.

`$swipe` is used by the `ngSwipeLeft` and `ngSwipeRight` directives in `ngTouch`, and by `ngCarousel` in a separate component.

# Usage

The `$swipe` service is an object with a single method: `bind`. `bind` takes an element which is to be watched for swipes, and an object with four handler functions. See the documentation for `bind` below.

## Methods

- ###

  `bind();`

  The main method of `$swipe`. It takes an element to be watched for swipe motions, and an object containing event handlers.

  The four events are `start`, `move`, `end`, and `cancel`. `start`, `move`, and `end` receive as a parameter a coordinates object of the form `{ x: 150, y: 310 }`.

  `start` is called on either `mousedown` or `touchstart`. After this event, `$swipe` is watching for `touchmove` or `mousemove` events. These events are ignored until the total distance moved in either dimension exceeds a small threshold.

  Once this threshold is exceeded, either the horizontal or vertical delta is greater.

  - If the horizontal distance is greater, this is a swipe and `move` and `end` events follow.
  - If the vertical distance is greater, this is a scroll, and we let the browser take over. A `cancel` event is sent.

  `move` is called on `mousemove` and `touchmove` after the above logic has determined that a swipe is in progress.

  `end` is called when a swipe is successfully completed with a `touchend` or `mouseup`.

  `cancel` is called either on a `touchcancel` from the browser, or when we begin scrolling as described above.