Ion frame wipes?

Does ionic have directives for scrolling or other events?
I found this service: $ionicGesture . Should I create my own directives with this?

Or do I need to use something else like ngTouch?

+4
source share
3 answers

There are no scrolling directives right out of the box, but since the events are exposed, it's pretty easy to throw something away.

 .directive('detectGestures', function($ionicGesture) { return { restrict : 'A', link : function(scope, elem, attrs) { var gestureType = attrs.gestureType; switch(gestureType) { case 'swipe': $ionicGesture.on('swipe', scope.reportEvent, elem); break; case 'swiperight': $ionicGesture.on('swiperight', scope.reportEvent, elem); break; case 'swipeleft': $ionicGesture.on('swipeleft', scope.reportEvent, elem); break; case 'doubletap': $ionicGesture.on('doubletap', scope.reportEvent, elem); break; case 'tap': $ionicGesture.on('tap', scope.reportEvent, elem); break; } } } }) 

View this demo

+5
source

The swipe directives did not seem to exist when this question was active, but they are now available: http://ionicframework.com/docs/api/directive/onSwipe/

 <button on-swipe="onSwipe()" class="button">Test</button> 

Also available: on-swipe-left , on-swipe-right , on-swipe-up and on-swipe-down .

+10
source

There is a great tutorial explaining how to do this with Ionicframework and AngularJS http://ionicframework.com/blog/ionic-swipeable-cards/

Basically, you will create a view using Ijonframework objetcs / functions as a snippet below, and create a directive that will name it. See the manual for more details.

 var SwipeableCardView = ionic.views.View.inherit({ initialize: function(opts) { // Store the card element this.el = opts.el; this.bindEvents(); }, bindEvents: function() { var self = this; ionic.onGesture('drag', function(e) { // Process drag }, this.el); ionic.onGesture('dragend', function(e) { // Process end of drag }, this.el); }, 
+1
source

Source: https://habr.com/ru/post/969800/


All Articles