如何将 Angular Material Drag Drop 用于 2 个自定义列表组件

问题描述

来自 Angular Material 站点的所有拖放示例都显示一个具有 2 个数组的组件:https://stackblitz.com/angular/volxgedeaga?file=src%2Fapp%2Fcdk-drag-drop-connected-sorting-group-example.ts

但是如果您有 2 个自定义组件,每个组件代表一个列表,并且您想在这 2 个组件之间拖放项目,那么组织代码的正确方法是什么?

我已经实施了以下解决方案:https://stackblitz.com/edit/angular-aqfhpg?file=src%2Fapp%2Fcdk-drag-drop-connected-sorting-example.ts

基本上,父组件保存数据(2 个数组),而 2 个子组件仅显示数据并提供拖放项目的选项。当 drop 事件发生时,子组件会向更新这两个数组的父组件分派一个事件。

这个解决方案好吗?有没有更好、更简单的方法来实现这一目标?

提前致谢!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)