Javascript 重写$swipe内部方法bind（）事件

所以首先我要告诉你我正在努力实现的目标。我有一个混合应用程序，滑动动作没有给人原生应用程序的感觉。在本机应用程序中，当您在选项卡之间滑动时，您可以看到当前选项卡的幻灯片正在退出，而新选项卡正在进入。这不是很突然，如果你不在本机应用程序中保留触摸功能，你可能会看到第一个标签的一半和第二个标签的一半。 （检查whatsApp选项卡中的滑动动作）

因此，现在我使用的是

ngTouch

的

ngSwipeLeft

和

ngSwipeRight

，如果我在幻灯片完成时添加任何动画，这会非常突然，用户体验也不好

如果您通读了

$swipe

的内容，则

滑动操作有四个事件：
开始
，
移动
，
结束
和
取消
。
那么，如何覆盖这些事件，以便在流中添加自定义css呢

那么，我们如何让刷卡事件在此时添加功能。

因此，尽管我以不同的方式解决了我的问题，但我将分享如何覆盖
$swipe
bind
方法

因此，如果创建了一个指令
customablesweep
，则这四种方法可以被
覆盖，如下所示：

angular.module('xpresso')
.directive('customizableswipe',['$swipe','$window',
  function($swipe,$window){

return {
  restrict: 'EA',
  link: function(scope,ele,attrs,ctrl){
    var startX,startY;

    $swipe.bind(ele,{
      'start' : function(coords){
        console.log("Coord start is :: ",coords.x);
      },
      'move' : function(coords){
        console.log("Coord move is :: ",coords.x);
      },
      'end' : function(coords){
        console.log("Coord end is :: ",coords.x);
      },
      'cancel' : function(coords){
        console.log("Coord cancel is :: ",coords.x);
      }
    });
  }
}
}]);

希望这可能会对某人有所帮助：）
因此，尽管我以不同的方式解决了我的问题，但我将与大家分享如何覆盖
$swipe
绑定
方法

因此，如果创建了一个指令
customablesweep
，则这四种方法可以被
覆盖，如下所示：

angular.module('xpresso')
.directive('customizableswipe',['$swipe','$window',
  function($swipe,$window){

return {
  restrict: 'EA',
  link: function(scope,ele,attrs,ctrl){
    var startX,startY;

    $swipe.bind(ele,{
      'start' : function(coords){
        console.log("Coord start is :: ",coords.x);
      },
      'move' : function(coords){
        console.log("Coord move is :: ",coords.x);
      },
      'end' : function(coords){
        console.log("Coord end is :: ",coords.x);
      },
      'cancel' : function(coords){
        console.log("Coord cancel is :: ",coords.x);
      }
    });
  }
}
}]);

希望这可能对某人有所帮助：）
通常情况下，它必须非常简单。在您自己的侦听器函数上使用
event.preventDefault
和
event.stopPropgination
来停止默认事件。@mtizziani但我只想在调用这4个事件时添加我自己的css功能，而不是停止或类似的任何操作。我只想在调用这些事件时添加一些内容。@arqum您是否尝试过您的css语句和重要语句？e、 g.
.classOfSomething{color:red！important；}
这告诉css处理它比内联语句更强。如果您只想操作css功能，这可能会对您有所帮助。否则，您必须使用js事件停止原始事件，直到所有事情完成，然后调用原始事件。通常情况下，它必须非常简单。在您自己的侦听器函数上使用
event.preventDefault
和
event.stopPropgination
来停止默认事件。@mtizziani但我只想在调用这4个事件时添加我自己的css功能，而不是停止或类似的任何操作。我只想在调用这些事件时添加一些内容。@arqum您是否尝试过您的css语句和重要语句？e、 g.
.classOfSomething{color:red！important；}
这告诉css处理它比内联语句更强。如果您只想操作css功能，这可能会对您有所帮助。否则，您必须使用js事件停止原始事件，直到所有事情完成，然后调用原始事件。