ngDraggable 在拖动结束后避免 ng-click

Question

我在 ng-drag 元素上有 ng-click，当我开始移动元素时一切正常，但是当我停止它时，那个元素激活了我的 ng-click，我怎样才能避免 ng-点击?

<div ng-click="unselectImage(image);" ng-drag="true" ng-drag-data="'multipleItems'" ng-center-anchor="true" data-allow-transform="false" ng-drag-success="selectImage(image);"></div>

我正在使用 ngDraggable。我尝试使用 ng-drag-success 但没有成功。

Answer 1

我在 David Zemens 的帮助下所做的。我发现我可以使用

$rootScope.$on('draggable:start', function (data) {
    isDragging=true;
});

在我的 ng-click 函数中，我添加了如下内容：

$scope.unselectImage = function (image) {
    if(isDragging) isDragging=false;
    else{
        // do the magic
    }
}

通常它可以解决问题。当拖动开始时，它广播它正在开始，当它结束时 ng-click 工作，在我们的例子中它只是说拖动已经结束。

Answer 2

我制定了一个指令 (alClick)，它只是 ng-click 但如果默认情况下按下持续时间超过 750 毫秒，则会取消任何点击。因此，拖动或滑动时不会触发点击事件。

<div al-click="unselectImage(image);" ng-drag="true" ng-drag-data="'multipleItems'" ng-center-anchor="true" data-allow-transform="false" ng-drag-success="selectImage(image);"></div>

ngDraggable 在拖动结束后避免 ng-click

ngDraggable avoid ng-click after drag end

angularjs

draggable

angularjs-ng-click