11

我目前正在使用angular-ui-tree库，并且正在尝试实现以下行为：

当用户只需单击“可拖动节点”时，它会触发 ng-click 功能，如果用户单击并开始拖动 ng-click 将被忽略并开始常规拖放操作。

我有以下html结构：

<div ui-tree="rootTree" ng-controller="Controller">
    <div ui-tree-nodes="" ng-model="nodes">
        <div ng-repeat="node in nodes" ui-tree-node="" ng-click="selectNode(node)" >
            <div ui-tree-handle="">
            ...
            </div>
        </div>
    </div>
</div>

当前的行为是拖放立即在“mousedown”开始，并且无法区分“单击”和尝试开始拖动

这是触发节点uiTreeNode.js拖放的库代码 

var bindDrag = function() {
   element.bind('touchstart mousedown', function (e) {
   if (!scope.$treeScope.multiSelect) {
      dragDelaying = true;
      dragStarted = false;
      dragTimer = $timeout(function() {
         dragStartEvent(e);
         dragDelaying = false;
      },    scope.$treeScope.dragDelay);
   } else {
      toggleSelect(e);
   }
   });
   element.bind('touchend touchcancel mouseup', function() {
      $timeout.cancel(dragTimer);
   });
};
4

2 回答 2

10

我刚刚遇到了同样的问题，我通过将 data-drag-delay 增加到 100 来解决它，试试：

ui-tree="rootTree" ng-controller="Controller" data-drag-delay="100"

于 2014-12-30T16:47:14.220 回答
2

这是一个很老的问题，但如果你不想有延迟，你可以注册dropped()回调并在索引没有改变的情况下执行你的点击操作。例如：

dropped: function(event){
    //if element was not moved, use click event
    if(event.source.index == event.dest.index){
        $scope.someAction();
    }
}
于 2016-05-30T14:14:10.360 回答