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

External Filtering

The Grid allows you to filter its data externally. When using this approach, you could omit the built-in filterable option of the Grid, which is set to false by default.

In order to filter the data, utilize the filterBy method, which is part of the kendo-data-query utility package. It accepts two parameters:

    public applyFilter(filter: CompositeFilterDescriptor): void {
        this.gridData = filterBy(sampleProducts, filter);
        ...
    }

Using the Filter Component

The Filter component provides you with a very suitable UI for external filtering. It allows the user to enter the desired filter and constructs the ready-to-use CompositeFilterDescriptor filter expression as a value.

The following example demonstrates how to implement external filtering using the Filter component. For the purposes of the demo, the Filter component is placed inside a Window.

Example
View Source
Edit In Stackblitz  
Change Theme:

In this article

Not finding the help you need?