Infragistics|Ignite UI for Angular|將樣式應用於 IgxGrid 列標題

infragistics log


可以使用 IgxGrid 的 IgxColumn 公開的 headerClass 來設置列標題的樣式。

<igx-grid #grid1 [data]="data" width="700px"
height="300px" displayDensity="compact">
<igx-column field="Id" header="ID"></igx-column>
<igx-column field="Name" header="商品名"
headerClasses="name-column-header"></igx-column>
<igx-column field="Price" header="価格"></igx-column>
<igx-column field="RegisteredDate" header="登録日">
<ng-template igxCell let-val>
{{val | date:'yyyy/MM/dd'}}
</ng-template>
</igx-column>
<igx-column field="IsActive" header="アクティブ"></igx-column>
</igx-grid>


::ng-deep {
.name-column-header .igx-grid__th-title {
color: red;
text-decoration: underline;
}
}




































延伸閱讀
aa71435723的大頭照
Winston

Eggplant DAI 自動化測試專家。

留言