New to Kendo UI for Angular? Start a free 30-day trial

FilterFieldsTemplateDirective

Directive

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.

Definition

Package:@progress/kendo-angular-filter

Selector:[kendoFilterFieldsTemplate]

Syntax:

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>