Ignite UI for Angular 9.1.3 バージョン時点での情報に基づいています。

IgxGridのエクセルスタイルフィルターのダイアログでは、データの並べ替えや列固定の設定もできるようになっています。

これらの設定を削除してフィルターの項目のみのシンプルな構成にしたい場合は、igx-gridの直下に空のng-templateを列挙し、それぞれのng-templateに対してigxExcelStyleXXXX(XXXXの部分は機能名(Sorting、Hiding、等)が入ります)テンプレートディレクティブを指定してください。

<igx-grid #grid1 ...
    [allowFiltering]="true" [filterMode]="'excelStyleFilter'">

    <!-- igx-gridの直下にng-templateを置き、igxExcelStyleXXXXテンプレートディレクティブを指定する -->
    <ng-template igxExcelStyleSorting></ng-template>
    <ng-template igxExcelStyleHiding></ng-template>
    <ng-template igxExcelStyleMoving></ng-template>
    <ng-template igxExcelStylePinning></ng-template>
    <ng-template igxExcelStyleSelecting></ng-template>

    ....

</igx-grid>

 

設定前

赤枠の中がフィルター以外の設定項目です。

 

設定後

フィルター以外の設定項目が消えました!

 

サンプル

 

リファレンス

 

Tagged:

製品について

Ignite UI for Angular