模态上的 Angular5 PrimeNG 数据表，上下文菜单显示在模态后面

Question

我有一个模态 window，其中包含启用了 ContextMenu 的 PrimeNG 数据table。 问题是，当我右键单击 table 行之一时，我的右键单击上下文菜单位于模态 window 后面。我添加了 appendTo="body" 但除了正确定位外，这没有帮助。现在的主要问题是上下文菜单有一个 z-index 位于模式后面。

我已尝试明确设置 z-index，但无法覆盖每次右键单击时应用于上下文菜单的动态生成的 CSS。

有什么想法吗？

Answer 1

您可以设置上下文菜单的基础 z-index 属性。

<p-contextMenu #cm [model]="items" appendTo="body" baseZIndex="99999"></p-contextMenu>

here is stackblitz implementation