问题标签 [angulardraganddroplists]

在angular-drag-and-drop-lists 中，您可以使用dnd-dragover指令。我不知道如何检测dragLeave事件。问题是我不能使用ng-mouseleave指令，因为在拖动项目时它永远不会被调用。任何其他 JS 或 CSS 解决方案也是如此。

有什么方法可以检测dragLeave事件吗？

我看过这个答案：How to start mouseover event while dragging但是，由于我不想使用 XY 坐标，所有建议的解决方案都可以正常工作。

我需要在我的应用程序中创建可排序的拖放列表。因此，为此我使用了angular-drag-and-drop-lists，它适用于少量项目。

但是，我的应用程序可能有数千个项目。所以，为了提高速度，我需要使用.md-virtual-repeat提供的Angular Material。它使用正确数量的元素将模型保持在后台。但是，DOM 只呈现那些在虚拟容器中可见的内容。

因为库使用渲染$index来跟踪元素，所以使用虚拟中继器会产生各种问题，因为$index现在是虚拟的。

例如，其中一些问题是：

• 拖动的元素在model

• 位于放置位置的元素将从model

• 在拖动过程中，某些元素可能会从原始元素中丢失model

• ETC...

你有什么建议来解决这个问题？

除了使用这个库之外，还有其他更简单的解决方案吗？

谢谢

我在这里使用 angular-drag-and-drop-lists 包来创建拖放列表。但是，被拖动的元素总是消失。在所有演示中，您可以在使用鼠标移动它时看到拖动的元素。但是我在下面的实现中看不到这个元素。

我将我的CSS设置如下：

我能够看到占位符，并且我已经验证.dndDraggingSource {display: none}正确地使原始元素消失。但是，被拖动的元素.dndDragging:not(.dndDraggingSource)将显示为大小正确且没有内容的红色块。

拖拽幕后发生了什么？为什么这个拖动的元素在演示代码中正确显示？display: none使用on似乎很常见.dndDraggingSource，所以我很确定还有另一个 DOM 元素被拖来拖去。那个 DOM 元素是什么，我如何检查它？根据行为，我认为还有另一个元素被拖来拖去。但是，如果您检查 angular-drag-and-drop-lists.js 中的源代码，则该element.on('dragstart', function() {}块不会做任何事情来复制带有.dndDraggingSource.

== 更新 ==

所以，我意识到，如果你在 div 中塞进一些乱码，它就会出现。但是跨度和确实都不是{{item.title}}。您需要对数据模型做些什么来完成这项工作吗？

在我的场景中，放置区最初是空的，所以我为 dnd-list 创建了一个空数组。然后我注意到 angular-drag-and-drop-lists 不起作用 - 也没有调用 dragover 和 drop 回调。

我创建了一个 plunker 来演示这个：

http://plnkr.co/edit/uMoA2bk1UB8gJVal6UAb?p=preview

在您打开 scripts.js 并将数组更改为包含某些内容（例如，一个空对象）之前，它不会起作用。这是预期的行为，还是缺陷？

我目前正在使用angular-drag-and-drop-lists来生成 JsonDTO 对象。从 JSON 生成图形表示可以正常工作。通过拖放不同的元素来生成 JSON 也可以正常工作。我主要使用嵌套列表教程来设置初始列表并设置按钮以从中拖动新元素。但是，这仅在我尝试将 dnd-type 添加到 li-elements 并将 dnd-allowed-type 添加到 ul-elements 之前有效。使用这些类型是一项要求，因为我想用那个“编辑器”创建的 Json 中有一定的子元素层次结构。

在下面找到我如何实现它的一些代码片段。如果您需要更多信息，请告诉我。如果有人可以帮助我解决这个问题，我将不胜感激

我想在其中插入一些东西的列表：

用于拖动新页面的按钮：

我正在使用角度拖放列表库来拖放列表中的项目。目前，我看到该项目可以在整个页面中拖动。如何将拖动区域限制在特定区域而不是任何地方。我检查了他们的 API，但我没有看到任何选项。

我正在使用角度拖放插件。当我将页面滚动到一定距离时会出现此问题。然后，拖动一个项目并释放。释放的项目返回到错误的位置（即）比其实际位置高一些像素。此问题仅发生在我的 Angular 应用程序中，无法在 jsfiddle 或 codepen 等任何其他地方重现。因此，屏幕记录了问题并上传到以下链接， https: //mega.nz/#!7s1FHTYL!VQf5OnU3iMOlZIQjn1oKiilVaRr6s2B_Py0l7mbl-Wo

有人请帮我解决这个问题..在此先感谢..

我正在使用 Google 的Angular Drag and Drop Lists，但我认为问题在于底层 HTML5 拖放不适用于 Angular ( v1.6.1 )。

根据MDN（底部的注释，在“完成拖动”下）：

如果源节点在拖动过程中被移动或移除（例如在“drop”或“dragover”上），则不会调度“dragend”。 错误 460801

我正在更改“dragover”事件中的 Angular 模型以在拖动操作期间显示反馈。我认为Angular 正在移动或删除（并重新创建）我的源元素，这就是阻止“dragend”发射的原因。

这意味着我无法知道拖动操作在不成功时何时完成（成功时在目标元素上触发“drop”事件）

请问有什么想法吗？

我正在使用 druska/native_js_drag_and_drop_helper.js 来自动化angular-drag-and-drop-lists

问题： 即使之后event.dataTransfer.setData(mimeType,angular.toJson(item))

dataTransfer.types未设置或可能不允许在 dragstart 和 drop 事件中读取

观察：在手动拖放dragstart事件期间

观察：使用自定义事件时

我在用

我无法初始化 dataTransfer 对象。dataTransfer.items 和 dataTransfer.types 是只读属性，我不知道如何正确初始化它们。MDN 数据传输

Angular 中的新功能，链接来自我尝试创建的位置。控制台没有错误，也没有显示结果。我的要求略有不同，但这需要成为骨干但无法完成。我想要两个表之间的拖放功能，而且它不应该是可排序的。如果从任何表中拖动项目，则应将其拖放到另一个表中，并且不应允许排序。并且多选也应该是可能的，如下面的链接所示。不知道我做错了什么

https://marceljuenemann.github.io/angular-drag-and-drop-lists/demo/#/multi

html