如何更改p-dataTable邊框底部的顏色？

Question

當您進行選擇時，PrimeNG不允許我更改p-dataTablebottom-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。