Question

我在移动设备上组合ng-swipe和水平滚动有问题。用例是我有一个页面，刷卡应该下一个或上一个加载，内部有模块显示很多信息。其中一些是滚动的。

因此，只要您滚动父母的滑动即可开始导航。所以我在可滚动元素的父级上添加了另一对ng-swipe，并带有这种技巧：

self.onInnerSwipe = function($event) {
  $event.originalEvent.preventAction = true;
};

然后是父母：

var shouldActionProceed = function($event) {
  return !$event || !$event.originalEvent || !$event.originalEvent.preventAction;
};

self.goToPrev = function($event) {
  if (shouldActionProceed($event)){
    // Do Magic
  }
}

如果我在该元素上滑动但滚动条没有真正起作用，那么这就完成了动作未进行的方法。它有种类，但它没有。它开始一点然后停止。

在Chrome上，有时会记录此警告。

忽略尝试使用cancelable = false取消touchmove事件例如，因为滚动正在进行中且无法中断。

我在这里准备了一个演示：http://jsbin.com/webologavu/2/这个过于简单，但你可以重现这个问题。

任何提示？

Answer 1

我认为这是这些事件的并发问题。如果您的父事件不依赖于子事件，它可能会更好。为此：

//add a identifier to your list element
<ul class="myList" your-other-attrs></ul>

//should proceed can rely on the target element to find out
//if the target element belongs (or is) in your list.
var shouldActionProceed = function($event) {
    return !$($event.target).hasClass("myList") &&  //is myList?
        $($event.target).parents(".myList").length == 0; //has parent 'myList'?
};

这样，父事件可以在其上工作。

ngSwipe和水平滚动

1 个答案: