Question

具有一个设置了scrollHeight的可滚动表，并在更改了scrollHeight之后，滚动条应自动与表头对齐。表数据未更改。（我在可调整大小的对话框中有一个带有标题的可滚动表，并且在对话框调整大小时，表的scrollHeight会相应更改，但表的滚动条未与新的scrollHeight对齐）

将primeng更新到7.1.4版本。

<p-table [columns]="cols" [value]="cars" scrollable="true" [scrollHeight]="scrollHeight">
    <ng-template pTemplate="header" let-columns>
        <tr>
            <th *ngFor="let col of columns">
                {{col.header}}
            </th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowData let-columns="columns">
        <tr>
            <td *ngFor="let col of columns">
                {{rowData[col.field]}}
            </td>
        </tr>
    </ng-template>
</p-table>

在不更改数据的情况下动态更改scrollHeight时，在可滚动表上正确显示滚动条。

Answer 1

这似乎是一个持续存在的问题，这里有一种解决方法：https://github.com/primefaces/primeng/issues/5354。但似乎仍未解决。解决方法是添加以下样式：

.ui-table-scrollable-header-box {
  margin-right: 17px !important;
}

.ui-table-scrollable-body {
  margin-right: 17px !important;
}

Answer 2

我的解决方法：

p-table { cdk-虚拟滚动视口{ 溢出-y：滚动！重要； } }

Primeng标头与正文表未对齐

2 个答案: