Filtering Basics

The TreeList enables you to display only those TreeList records which meet specified criteria.

For more information on how to customize the filters in the Kendo UI TreeList for Angular, refer to the articles about the built-in filter templates and reusable custom filter components.

Getting Started

To enable filtering:

1. Set filterable to true.
2. Handle the filterChange event.
3. Bind the filter option to the respective class field.

The filtering conditions are declared as FilterDescriptors. Each consecutive filter is added to the previous ones and reduces the subset of data. For additional information, refer to the article on the process helpers for bulk data operations.

Alternatively, you can automate and customize the filtering functionality through the available data-binding directives.

Filter Row

By default, when filtering is enabled, the TreeList renders a filter row in its header. Based on the type of data the columns contain, the filter row displays textboxes in each column header where the user can filter string, numeric, or date inputs.

Filter Menu

The TreeList also enables you to embed a drop-down filter menu directly in each column header. To add a filter menu to the TreeList, set filterable to menu.

Suggested Links

• FilterDescriptors
• dataStateChange
• Built-In Filter Templates
• Reusable Custom Filter Components.
• API Reference of the TreeListComponent
• Data Binding Basics