css - 可滚动涡轮表中的 PrimeNG 过滤器下拉问题

Question

在 prime-ng turbo table 中，当我们将过滤器下拉列表放入可滚动表下拉列表中时

没有滚动表下拉菜单完美。 这很完美

但是当可滚动表时，下拉表将进入表内 不完美。所以我想在表外而不是表内做下拉菜单。

这是一个链接https://primeng-table-bry1sl.stackblitz.io/以查看代码。请查看 1024 分辨率，以便您可以看到表格中的滚动并选择其中一个品牌来过滤数据。

谁能帮我。

Answer 1

尝试使用appendTo="body"Primeng 下拉列表中可用的属性，这可能对您的情况有所帮助。

此处的完整示例 -

<p-dropdown appendTo='body' [options]="value" [style]="{'width':'100%'}" placeholder="Select"></p-dropdown>

从这里参考

Answer 2

问题在这里：

.ui-table-resizable .ui-table-thead>tr>th, .ui-table-resizable .ui-table-tfoot>tr>td, .ui-table-resizable .ui-table-data>tr>td {
    /* overflow: hidden; */
}

尝试评论溢出属性或设置为visible......它的工作原理！

Answer 3

通过覆盖以下溢出来解决：

//Old code in primeng.min.css
    .ui-table-scrollable-header, .ui-table-scrollable-footer {
        **overflow: hidden;**
        border: 0 none;
    }
//add this to your stylesheet instead
    .ui-table-scrollable-header, .ui-table-scrollable-footer {
        **overflow: visible;!important**
        border: 0 none;
    }

此外，在您的样式表中添加上述代码之后：

.ui-table-scrollable-view {
  overflow: hidden!important;
}

看这里结果图片