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

尚無瀏覽量

2023-08-06 更新

可以使用 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;

}

}

✦ 群昱 AccessSoft 你的全面軟體解決方案 ✦

身為全球眾多知名軟體在台灣合作夥伴，歡迎諮詢你需要的軟體服務！

群昱作為全球知名軟體推薦合作夥伴，致力於提供更多軟體解決方案給你！