Angular JS (angular-ui-tree) конфликт нг-кликов и событие начала перетаскивания

В настоящее время я использую библиотеку 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);
   });
};

2 ответа

У меня была та же проблема, и я решил ее, увеличив задержку перетаскивания данных до 100, попробуйте:

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

Это довольно старый вопрос, но если вы не хотите задерживаться, вы можете зарегистрироваться dropped() перезвоните и выполните действие, если индекс не изменился. Например:

dropped: function(event){
    //if element was not moved, use click event
    if(event.source.index == event.dest.index){
        $scope.someAction();
    }
}
Другие вопросы по тегам