html - Ng-click 不起作用 Dragula 拖放元素

Question

使用 Dragula 插件 (Angular 1)链接

ng-click 不工作在 li 元素上移动（拖放到另一个 ul）

<ul dragula='"second-bag"'>
   <li ng-click="fun()">Item One </li>
   <li ng-click="fun()">Item Two</li>
   <li ng-click="fun()">Item Three</li>
   <li ng-click="fun()">Item Four</li>
</ul>
<ul dragula='"second-bag"'>
   <li ng-click="fun()">Item One </li>
   <li ng-click="fun()">Item Two</li>
   <li ng-click="fun()">Item Three</li>
   <li ng-click="fun()">Item Four</li>
</ul>

app.controller('ExampleCtrl', ['$scope', function ($scope) {
   $scope.fun = function(){
          alert('test');
   } 
}]);

Answer 1

这可能是 dragula 的预期行为，因为为了拖动您实际单击的元素。

---

重要的部分是你为什么要监听一个拖动列表元素的点击事件？如果答案是操纵该特定元素或进行其他操作，dragula 为您提供了一系列机会。

<div dragula='"sixth-bag"'></div>
<div dragula='"sixth-bag"'></div>

app.controller('MuchExampleCtrl', ['$scope', 'dragulaService',
  function ($scope, dragulaService) {
    dragulaService.options($scope, 'sixth-bag', {
      moves: function (el, container, handle) {
        return handle.className === 'handle';
      }
    });
  }
]);

在此示例中，您正在更改“已处理”元素的 className。与此类似，您可以将此方法用于其他可能的结果。

链接：

• http://bevacqua.github.io/angular-dragula/
• https://github.com/bevacqua/dragula#optionsmoves

作为替代方案，您可能需要检查服务 ngDraggable 以获得更多“Angular1 样式”语法。

• ngDraggable：https ://github.com/fatlinesofcode/ngDraggable