隐藏在对话框后面的 PrimeNg 颜色选择器叠加层

Question

我在对话框中使用 PrimeNG 颜色选择器覆盖。

<p-colorPicker [(ngModel)]="activity.color" name="color" appendTo="body"></p-colorPicker>

问题是选择器没有显示并扩展了添加滚动条的对话框主体。我希望颜色选择器覆盖在对话框上。

设置appendTo="body" 适用于日历小部件，但不适用于颜色选择器。基于文档，我尝试了各种选项，例如在对话框 <p-dialog #activityDialog ... 中指定模板变量并在颜色选择器的 appendTo 中引用它，但这不起作用。

Answer 1

更新：

<p-dialog [contentStyle]="{'overflow':'visible'}">
</p-dialog>

这就是全部，并且已经记录在案：here

我通过设置让它工作：

:host /deep/.ui-dialog .ui-dialog-content {
    overflow: visible;
}

在包含对话框的组件的 css 中。虽然 :host /deep/ 是 deprecated by Angular

PrimeNg color picker overlay hidden behind dialog