当使用 cdkDragFreeDragPosition 时，cdkDrag 元素在彼此下方拖动

Question

我使用的是 angular 11.2。当我第一次模拟它时，所有 cdkDrag 元素的行为都符合您的预期，并且在屏幕上拖动时会位于其他元素的顶部。 Droplists 没有按照我需要的方式工作，所以我最终完全避免了 droplists，并使用 cdkDragFreeDragPosition 来控制我的 cdkDrag 元素发生的事情。现在一切都如我所愿，除了当我向右拖动 cdkDrag 元素时，它会位于屏幕上其他 cdkDrag 元素的下方。这种行为直到我添加了 cdkDragFreeDragPosition 属性后才被引入。

我觉得它应该像更改在屏幕上移动的元素的 zIndex 一样简单，但是我在这方面的所有尝试都失败了。这是显示问题的 stackblitz。将以下内容添加到 moveWord（在 cdkDragStarted 上触发的函数）是我尝试使用 zIndex 解决问题的尝试：

el.style.zIndex = this.zIndexSerial;
console.log(el.style.zIndex);
this.zIndexSerial++;

我还在 css 文件中的各种元素上使用了 z-index，尽管我已经支持所有这些尝试。任何朝正确方向的推动将不胜感激。