Angular：拖放树 - 定制

Question

据我了解，新的 Angular 7 提供了拖放功能。我搜索了有关 DnD 的 Tree 组件，但没有找到与树相关的太多内容。

我在Stackblitz上找到了一个工作示例。与此处总结的拖放功能相比，该解决方案看起来很清醒。一个更好的示例与ngx-tree-dnd相关。尽管如此，因为我想坚持使用材质，所以出现了一些问题：

1. 如何让普通的Angular树也有一些类似的重影效果呢？即在拖动时显示节点内容。
2. 如果我将节点放在同一层或更深/上层，是否有一种方法可以更好地直观地显示它？因为在当前的显示下，很难识别移动到哪一层
3. 如何加入一些动画？

Answer 1

经过对代码的一些研究和摸索后，我终于找到了如何让它变得更好。我将我的解决方案发布在StackBlitz上，以防其他人想要进行额外的调整。

我已修复的主要问题：

1. 用于放置的图像被设置为空 - 不知道为什么
2. 我增加了拖放区域 - 所以它现在也覆盖了边距（填充）
3. 我为选择开始的节点着色
4. 可以在 CSS 中轻松调整颜色
5. 我尝试解决性能问题。一种方法是使用数字而不是字符串。但我想可能还有其他改进。

我发现 DnD 的主要特点是大部分都是纯 JS 代码。没有太多 Angular 细节。

欢迎提出改进建议。