9

我有一个主题列表，每个主题都有一个颜色列表。我用一个打开 Angular 对话框的按钮显示所有主题，在对话框中我列出了该主题的所有颜色，这些颜色可以重新排序@angular/cdk/drag-drop。

如果我有一个只有 2-4 个主题的列表。我可以毫无问题地重新排序每个主题的所有颜色。但如果我有一个包含 20-30 个主题的列表。只有第一个主题可以正常工作，我可以打开对话框并重新排序项目，但如果我选择了最后一个项目，拖放不起作用。

我尝试调试错误，发现在重新排序不起作用时，前一个索引和当前索引具有相同的值。对于那些工作，正确的索引是正确的。

我在StackBlitz上构建了一个简单的应用程序，我可以在其中重现我遇到的问题。您可以尝试单击列表第一项的编辑按钮并查看它工作正常，您可以重新排序颜色，但尝试重新排序列表中的最后一个主题，您会发现它不起作用。我在控制台中没有看到任何错误。我用 Chrome 和 Firefox 都试过了，都遇到了同样的问题。

每次拖放颜色时，您还可以在控制台中查看当前和上一个索引。

这是该应用程序的链接。

4

1 回答 1

1

尝试将此类添加到您的全局 CSS 中。我确信它会在对话框下方的布局中产生一些临时问题，但拖放应该可以正常工作

html.cdk-global-scrollblock {
  position: initial !important;
}

html.cdk-global-scrollblock body {
  position: fixed;
}
于 2021-01-01T21:26:54.687 回答