HTML5拖放-当Angular移动或删除源元素时不会触发“dragend”

Posted 2023-05-08

【中文标题】HTML5拖放-当Angular移动或删除源元素时不会触发“dragend”

【英文标题】：HTML5 drag and drop - "dragend" not fired when source element is moved or removed by Angular

【发布时间】：2017-08-16 11:12:51

【问题描述】：

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

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

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

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

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

有什么想法吗？

【问题讨论】：

展示问题的示例将非常有帮助。 （为什么你认为 angular 会删除节点？我知道 angular 是坏人，但通常它会按照你的代码执行）

【参考方案1】：

为后代回答我自己的问题！

我解决了这个问题，确保 Angular 摘要循环在拖放操作期间没有运行。

这似乎支持了我关于源元素被 Angular 删除和重新创建以防止触发 dragend 事件的理论。

我不得不回退到 JQuery 以在拖放过程中提供视觉反馈。

HTH