DOCTYPE html>
<html ng-app="nickApp">
<head><meta charset="utf-8" name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,><script src="lib/ionic/js/ionic.bundle.min.js">script><link rel="stylesheet" type="text/css" href="lib/ionic/css/ionic.min.css">
head>
<body ng-controller="nickCtrl"><div><p>注册、解除手势事件都是按顺序,先button1在button2p><p>点击bind一次button注册一次事件p><button ng-click="add()">bindbutton><p>点击unbind一次button解除一次事件p><button ng-click="delete()">unbindbutton><br><br><button id="idCardNick">idCardNick button1button><br><br><button id="licenseNick">licenseNick button2button>div><script>
/* http://www.ionic.wang/js_doc-index-id-58.html
on(eventType, callback, $element)
off(eventType, callback, $element)
参数 类型 详情
eventType string 监听的手势事件。
callback function(e) 当手势事件发生时触发的事件。
$element element angular元素监听的事件。*//*
//完整汇总:
$ionicGesture服务--注册/解除手势事件监听:
on(eventType,callback,$element,options) - 注册手势事件监听函数
参数eventType是支持的事件类型;
参数callback指定监听函数;
参数$element是要绑定事件的jqLite元素。
参数options是on方法返回对象的一个子对象options
on()方法返回的是一个ionic.gesture对象,可供解除监听用。
off(gesture,eventType,callback) - 解除手势事件监听函数
参数gesture是on()方法返回的结果对象,
参数eventType是支持的事件类型
参数callback是要移除的监听函数。
$ionicGesture服务支持的事件类型有:
hold, tap, doubletap, drag, dragstart, dragend, dragup, dragdown, dragleft, dragright, swipe, swipeup, swipedown, swipeleft, swiperight, transform, transformstart, transformend, rotate, pinch, pinchin, pinchout, touch, release*/angular.module(&#39;nickApp&#39;,[&#39;ionic&#39;]).controller(&#39;nickCtrl&#39;, [&#39;$scope&#39;,&#39;$ionicGesture&#39;,function ($scope,$ionicGesture){$scope.data=[];var clickGesture0,clickGesture1,unbindWatch;//监听data.length动态添加删除click事件
unbindWatch=$scope.$watch(&#39;data.length&#39;,function(newval,oldval){if(newval==0){if(clickGesture0){OffclickFn(clickGesture0);}if(clickGesture1){OffclickFn(clickGesture1);}}else if(newval==1){clickGesture0=AddclickFn(&#39;#idCardNick&#39;,0);if(clickGesture1){OffclickFn(clickGesture1);}}else if(newval==2){clickGesture1=AddclickFn(&#39;#licenseNick&#39;,1);}else{//不用时为了性能销毁watch
unbindWatch();}console.log(clickGesture0);});/*function AddclickFn(selector,idx){return $ionicGesture.on(&#39;click&#39;,function(){console.log(arguments);console.log(idx);//这样可以获取idx},angular.element(document.querySelector(selector)));};*/function AddclickFn(selector,idx){//将idx存入options.idx在作为对象存入$scope.idxreturn $ionicGesture.on(&#39;click&#39;,clickFn,angular.element(document.querySelector(selector)),$scope.idx={idx:idx});};/*按住alt点击$ionicGesture.off进去看源码是这样的才知道ionic.wang这网站介绍gusture方法错了off: function(gesture, eventType, cb) {return window.ionic.offGesture(gesture, eventType, cb);}*/$scope.add=function(){if($scope.data.length<2){$scope.data.push(&#39;nick&#39;);}};$scope.delete=function(){$scope.data.pop();};function clickFn(ev,idx){//这里默认的arguments是event 自定义的参数idx无法获取??
console.log(arguments);console.log(idx);//undefined
console.log($scope.idx);//这样可以获取idx对象
};function OffclickFn(clickGesture){$ionicGesture.off(clickGesture,&#39;click&#39;,clickFn);};}]);script>
body>
html>