gpt4 book ai didi

Angular Material 嵌套拖放

转载 作者:太空狗 更新时间:2023-10-29 17:47:15 27 4
gpt4 key购买 nike

我正在尝试实现一组可重新排序的列表,其中包含可以在列表之间移动的元素,使用@angular/cdk/drag-drop,尽管我遇到了一些问题。

我已经成功地分别创建了单独的示例来实现单独的拖放,尽管当放在一起时我似乎无法同时实现这两个功能。

在组之间移动项目:https://stackblitz.com/edit/items-move

重新排序组:https://stackblitz.com/edit/groups-move

两者一起:https://stackblitz.com/edit/groups-items-move

似乎在Both together 示例中,单个项目的拖动按预期工作,但组的重新排序不起作用,然而,cdkDropListGroupcdk-drag-drop-connected-sorting-group-example.html 的第 4 行当移出 parent 时 <cdk-drop-list>然后导致相反的情况发生,这些组现在可以重新排序,但项目无法在组之间移动。

关于我哪里出错的任何指示?

最佳答案

看起来 cdkDropListGroup 不适用于嵌套列表。只需将 id 添加到列表中并使用 [cdkDropListConnectedTo] 将它们连接在一起。

两者一起:https://stackblitz.com/edit/nested-connected-lists

关于Angular Material 嵌套拖放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54075606/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com