Skip to content

Instantly share code, notes, and snippets.

@coldnew
Forked from taivo/ion-tabs-swipable.js
Last active August 29, 2015 14:16
Show Gist options
  • Save coldnew/b60fa636089c3716f0fb to your computer and use it in GitHub Desktop.
Save coldnew/b60fa636089c3716f0fb to your computer and use it in GitHub Desktop.
angular.module('yourModule')
.directive('tabsSwipable', ['$ionicGesture', function($ionicGesture){
//
// make ionTabs swipable. leftswipe -> nextTab, rightswipe -> prevTab
// Usage: just add this as an attribute in the ionTabs tag
// <ion-tabs tabs-swipable> ... </ion-tabs>
//
return {
restrict: 'A',
require: 'ionTabs',
link: function(scope, elm, attrs, tabsCtrl){
var onSwipeLeft = function(){
var target = tabsCtrl.selectedIndex() + 1;
if(target < tabsCtrl.tabs.length){
scope.$apply(tabsCtrl.select(target));
}
};
var onSwipeRight = function(){
var target = tabsCtrl.selectedIndex() - 1;
if(target >= 0){
scope.$apply(tabsCtrl.select(target));
}
};
var swipeGesture = $ionicGesture.on('swipeleft', onSwipeLeft, elm).on('swiperight', onSwipeRight);
scope.$on('$destroy', function() {
$ionicGesture.off(swipeGesture, 'swipeleft', onSwipeLeft);
$ionicGesture.off(swipeGesture, 'swiperight', onSwipeRight);
});
}
};
}]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment