FilterFieldsTemplateDirective

Updated on May 12, 2026

Replaces the default field selector DropDownList in the Filter component with a custom template. Apply it to an ng-template that is a direct child of a kendo-filter element.

The template context provides the following fields:

• let-currentItem—The filter descriptor for the current row. Set its field property to change the selected field. The component detects the change and updates the value, operator list, and editor type automatically.
• let-filters="filters"—The list of available FilterExpression items.

html

<kendo-filter>
  <ng-template kendoFilterFieldsTemplate let-currentItem let-filters="filters">
    <kendo-dropdownlist
        [data]="filters"
        textField="title"
        valueField="field"
        [valuePrimitive]="true"
        [value]="currentItem.field"
        (valueChange)="currentItem.field = $event">
    </kendo-dropdownlist>
  </ng-template>
  <kendo-filter-field field="name" editor="string"></kendo-filter-field>
</kendo-filter>

Selector

[kendoFilterFieldsTemplate]