Angular JS (angular-ui-tree) ng-click 冲突与拖动开始事件

2023-11-21

我目前正在使用角度 ui 树图书馆和我试图实现以下行为:

当用户单击“可拖动节点”时,它会触发 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>

当前的行为是“鼠标按下”时立即开始拖放,并且无法区分“单击”和尝试开始拖动

这是触发节点拖放的库代码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);
   });
};

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

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

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular JS (angular-ui-tree) ng-click 冲突与拖动开始事件 的相关文章

随机推荐

  • “endl”和“\n”之间的区别[重复]

    这个问题在这里已经有答案了 可能的重复 C std endl 与 n 我想知道是否有重要的这两种打印换行符的方法之间的区别 cout lt lt endl approach1 cout lt lt n approach2 有什么实际区别吗
  • 正则表达式否定整个单词? [复制]

    这个问题在这里已经有答案了 String test1 This is my test string 我想匹配一个不包含 test 的字符串 我可以用 Pattern p Pattern compile test 它有效 但在大多数网站上 例
  • Windows 上的 Python 和 XAMPP:如何做?

    我已经在我的 Win7x64 Xampp 和 Python 2 7 上安装了 现在我正在尝试获得Python语言的 力量 我该怎么做 我尝试过 mod python 和 mod wsgi 但第一个对于我的 Python 版本不存在 当我在安
  • 错误 CS2012:无法打开 <可执行路径> 访问 <可执行路径被拒绝>

    我当时正在 Visual Studio 2015 中开发 WPF 应用程序 一切都很顺利 直到意外地生成了 CS2012 错误 通知我它无法访问 更新 Debug 目录中的可执行文件 我尝试了以下方法但没有成功 Restart 关闭VS并再
  • 创建表单并在后台线程上使用 Form.ShowDialog

    使用Winforms 如果我所在的线程不是 主 ui 线程 我可以安全地进行操作吗 创建一个表格 在该表单上调用 ShowDialog 看来我会遵守以下规则 Winforms 控件必须在创建它们的线程上进行修改 从我完成的一些阅读来看 Sh
  • OpenCV TypeError:轮廓不是 numpy 数组,也不是标量

    我正在尝试使用 OpenCV 从 Nike 图像中提取标签 这是一个教程代码 取自 http opencv code com tutorials ocr ing nikes new rsvp program 我已经修改了几行代码 并且该部分
  • 指南针精灵图像和比例

    在过去的 4 个小时里 我一直在尝试找到一种使用 Compass 和 sass 创建精灵图像的方法 该图像还可以自动缩放每个单独的图像以与背景大小属性一起使用 我发现没有任何效果 不敢相信有这么难 有人有一个可行的例子吗 编辑 这是我到目前
  • 在线游戏,或者比ajax更快的东西来发送/接收数据

    我会尽可能地缩短它 到目前为止我所做的 我的游戏将使用 JavaScript 运行setTimeout or setInterval 这不是闪光灯或任何特殊的东西 到目前为止 我所做的就像一个测试运行 这样你可以更好地理解 几乎是循环 Aj
  • 为什么使用 Func 而不是 Predicate

    这只是一个好奇的问题 我想知道是否有人有一个好的答案 在 NET Framework 类库中 我们有以下两个方法 public static IQueryable
  • 如何在 C# 中实现进度条?

    如何在 C 中实现数据库调用的进度条和后台工作程序 我确实有一些处理大量数据的方法 它们是相对较长的运行操作 因此我想实现一个进度条 让用户知道确实发生了一些事情 我想过使用进度条或状态条标签 但由于只有一个 UI 线程 即执行数据库处理方
  • 如何在 Java 15 及以后版本中继续使用 Javascript

    在我的 Java 应用程序中 一个重要的小功能是能够根据音频文件的元数据 例如专辑 艺术家 标题 重命名音频文件 并且使用指定掩码JavaScript 这使得重命名功能非常灵活和强大 我知道 Javascript 已被弃用 但现在看来它实际
  • 适用于德尔福 2006/德尔福 2007/德尔福 2009 的 FitNesse

    是否有适用于 Delphi 2006 2007 2009 的 FitNesse 版本 如果是的话我在哪里可以找到它 还有其他类似 FitNesse 的程序可以在 Delphi 2006 上运行吗 Fitnesse 支持 Delphi 请参阅
  • eclipse 产品调用导致 java.lang.RuntimeException: 未找到应用程序 id

    我刚刚导出了一个产品 如果我点击 启动 Eclipse 应用程序 按钮 该产品就可以正常工作 如果尝试执行导出的产品 我会在启动时收到以下异常 SESSION 2012 03 16 17 28 21 206 eclipse buildId
  • 无法在 Linux 中复制名称中包含“$”的文件

    在我的 Linux 目录中 有一个名为TopSample Config class 每当我尝试将此文件复制到另一个位置 目录时 它都不允许我这样做 我这样做 cp TopSample Config class home praveen co
  • Freeradius 和 PHP 身份验证脚本

    我正在尝试根据 PHP 脚本对 freeradius 用户进行身份验证 但没有成功 我已经尝试了几个小时来配置这个权利 而我在谷歌上找到的所有线程要么是死链接 要么是过时的 半径配置文件 prefix usr exec prefix usr
  • 使用 netcat 逐行发送文本文件

    我正在尝试使用以下命令逐行发送文件 nc host port lt textfile cat textfile nc host port 我尝试过tail and head 但结果相同 整个文件作为唯一的行发送 服务器正在使用特定的守护进程
  • 将 SSL 证书附加到 Terraform 中的 Azure 应用程序网关

    我尝试使用 Terraform 自动部署应用程序网关已经花了很长时间 但它只是失败并显示错误消息 我已确保所有协议设置为 HTTPS 不过 我怀疑 PFX 证书有问题 是不是我没有提供身份验证证书导致失败 在网上尝试了很多方法来获得解决方案
  • 什么时候放弃 MVVM 才有意义?

    当我学习 WPF 时 我一直专注于仅应用MVVM模式到应用程序 但是 我注意到对于某些功能比如验证 很难或不可能保持 MVVM 模型的真实性 很多时候只是简单地粘贴x Name在一个元素上并改变它代码隐藏事件处理程序立即解决问题 你有什么现
  • 我该如何用扫描仪(java)处理它?

    我有一个关于扫描仪的问题 我在一家小公司工作 我们有一个软件 它生成一个大文本文件 我们必须从中得到一些有用的信息 我想用java编写一个简单的应用程序以节省时间 你能指导一下吗 例如我想要这个输出 Output 射频识别 25 蓝色 56
  • Angular JS (angular-ui-tree) ng-click 冲突与拖动开始事件

    我目前正在使用角度 ui 树图书馆和我试图实现以下行为 当用户单击 可拖动节点 时 它会触发 ng click 功能 如果用户单击并开始拖动 ng click 会被忽略 并开始常规的拖放操作 我有以下 html 结构 div div div