Question

当您进行选择时，PrimeNG不允许我更改p-dataTable bottom-border-color。

我尝试从HTML中获取该元素，但它不起作用，并且在样式方面，他们网站上的文档很差。

我想在样式表中进行此更改。

<p-dataTable  #paperTable [custom-filters]="customFilters" id="tableId" 
scrollHeight="80%"scrollable="true" [pageLinks]="3" [value]="dataGrid"
selectionMode="single" [paginator]="true" [rowsPerPageOptions]="[25,50,100]" 
[rows]="25" [responsive]="true">
   <p-column  field="id" header="Id" [sortable]="true" [editable]="true" [hidden] = "true">
   </p-column>
</p-dataTable>

Answer 1

PrimeNG的DataTable组件具有tableStyleClass属性，可用于将CSS类添加到表中，例如：

.red-bottom-border {
    border-bottom: 3px solid red;
}

然后在你的模板中：

<p-dataTable  #paperTable [custom-filters]="customFilters" id="tableId"
scrollHeight="80%" scrollable="true" [pageLinks]="3" [value]="dataGrid"
selectionMode="single" [paginator]="true" [rowsPerPageOptions]="[25,50,100]" 
[rows]="25" [responsive]="true" tableStyleClass="red-bottom-border">

您可以找到DataTable组件here的所有属性列表。

此处工作Plunker。

如何更改p-dataTable边框底部颜色？

1 个答案: