PrimeNG

Question

我只想在一个组件中更改 p-table 标题单元格的背景颜色，我该怎么做？

我试过了<ng-template pTemplate="caption" class="myStyle">

和.myStyle{ background: rgb(9,169,121) !important; } 在 my.component.scss

但是没用。

帮帮我！谢谢！

编辑：终于成功了！我看到了@Antikhippe 的回答，但我不得不添加

:host ::ng-deep { #myTable {
.p-datatable-thead{ background: red;
} .p-datatable .p-datatable-thead > tr > th { background: inherit; } } }

Answer 1

pTemplate="caption" 将只适合您的 table header 的一部分，您必须继续 p-datatable-header class:

试试这个：

:host ::ng-deep {
  #myTable {
    .p-datatable-header {
      background-color: red;
    }
  }
}

我用 #myTable 包围了 p-datatable-header class 以仅将此 CSS 应用于 ID 为 myTable 的 table：

<p-table id="myTable" [value]="products">

PrimeNG - 如何为单个组件更改 p-table 中 pTemplate="caption" 的样式