How to change default operator for a date filter in a Kendo grid for Angular?

Question

Default filter operator is "Is after or equal to". In the code it's "gte" (greater than or equal to). How to change this default behavior for a whole grid or particular date column? I would like "equal to". Many columns in a grid have default filters, but I want to change operator only for date fields. https://www.telerik.com/kendo-angular-ui/components/grid/filtering/basics/#toc-date-filter

Answer 1

So we need to override the default operator of the Date Filter Row. Bind the DateFilterCellComponent's operator property to the desired default operator.

Default Filter Operator article.

import { Component } from '@angular/core';
import { Product } from './model';
import { sampleProducts } from './products';

@Component({
selector: 'my-app',
template: `
        <kendo-grid [kendoGridBinding]="gridData" [filterable]="true" [height]="250" [style.width.px]="400">
            <kendo-grid-column field="ProductID" title="ID" [width]="40" [filterable]="false"> </kendo-grid-column>
            <kendo-grid-column field="FirstOrderedOn" title="Order Date" format="dd/MM/yyyy">
                <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
                    <kendo-grid-date-filter-cell [column]="column" [filter]="filter" operator="eq">
                    </kendo-grid-date-filter-cell>
                </ng-template>
            </kendo-grid-column>
        </kendo-grid>
    `,
})
export class AppComponent {
public gridData: Product[] = sampleProducts;
}