Angular 8嵌套拖放
不幸的是，我在一个常见的问题中找不到解决方案。
以下是指向代码https://stackblitz.com/edit/angular-ygwaxs的链接
我得到了这样的场景:从服务器得到一个json树结构(在本例中，组件内部有一个直接的半义化)
有空节点，但每个人都声明了自己的子数组。
我尝试在一个组件中使用html级别的ng-template和ng-container来管理这种rappresentation，这就是我的工作。
问题是我需要使用拖放来对节点进行排序。
具体地说，每一节都可以是子或父，所以每一节都是可拖放的。
我尝试用Angular Material 8CDK Drag&Drop (https://material.angular.io/cdk/drag-drop/overview)和vanilla Javascript来实现它(https://developer.mozilla.org/…/…/API/HTML_ drag _ and _ drop _API)，但是，如果在第一种情况下嵌套拖放对解决方案没有帮助，在第二种情况下，我已经进行了测试，但在Angular组件内部，drop (drop)的绑定事件似乎不被接受；当我试图拖动标记dropzone内的一节时，光标在非drop状态下改变。
有人能帮我吗？
回答 3
Stack Overflow用户
发布于 2020-01-16 03:47:36
最近，我在树形结构中使用嵌套拖放/排序项目时也遇到了问题。
我的解决方案是通过cdkDropListConnectedTo链接不同的cdkDropLists，并通过cdkDrag项目上的cdkDragMoved事件获取目标放置位置。
演示：https://stackblitz.com/edit/angular-cdk-nested-drag-drop-tree-structure
Stack Overflow用户
发布于 2019-12-03 17:34:53
您可以使用可排序的js嵌套排序表：https://sortablejs.github.io/Sortable/#nested
还有一个可排序js的角度实现：https://github.com/SortableJS/ngx-sortablejs
Stack Overflow用户
发布于 2021-06-27 20:34:48
有一篇文章是关于可排序的、嵌套的、拖放列表的。它还包括一个仅使用@angular/cdk的工作stackblitz演示
https://sienakasa.medium.com/angular-cdk-nested-drag-and-drop-d849365a7ca9
https://stackoverflow.com/questions/59153753
复制相似问题
腾讯云开发者
