html - Primeng turbo 表格单元格数据与其他单元格重叠

Question

如何防止 primeng turbo 表格单元格数据与其他单元格重叠，我试图添加 - [style]=" {'overflow':'hidden' }"至:<tr> , <td>和 <div> ，并且这些元素都没有解决重叠..任何人都知道如何解决这个问题？

Answer 1

将 class="ui-resizable-column"添加到每一列和每一行。它可以防止其他单元格中的数据重叠到其中(而不是重叠到其他行中)，这就是为什么在下面的示例中，即使复选框也有它。

示例:

这将使列标题不重叠:

<th *ngFor="let col of columns" class="ui-resizable-column">
</th>
<th style="width: 2.25em" class="ui-resizable-column">
  <p-tableHeaderCheckbox></p-tableHeaderCheckbox>
</th>

然后你对行做同样的事情:

<td *ngFor="let col of columns" class="ui-resizable-column">
</td>
<td class="ui-resizable-column">
  <p-tableCheckbox [value]="selectedrow"></p-tableCheckbox>
</td>