Angular TreeList Overview

The Kendo UI for Angular TreeList displays hierarchical data in a tabular format and comes with an extensive set of built-in features including paging, sorting, filtering, and data binding.

The TreeList is built from the ground up and specifically for Angular, so that you get a high-performance control which integrates tightly with your application and with the rest of the Kendo UI for Angular components.

The TreeList is part of Kendo UI for Angular, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.Start Free Trial

Angular TreeList Example

Change Theme

Theme

Loading ...

Angular TreeList Key Features

The Kendo UI for Angular TreeList component delivers a range of handy and developer-friendly features whose number and further development are not limited by the list in this section. The Kendo UI for Angular team constantly invests efforts to improve the performance and add more value to the existing TreeList library as well as develop new features to it.

Data Binding

The TreeList features built-in and custom data-binding directives, which encapsulate the logic for handling data operations such as sorting and filtering out-of-the-box. Read more about the data binding functionality of the TreeList...

Editing

Depending on your users' requirements, you can opt for the inline or the in-cell edit modes, provide editing from an external form or Redux Form, and also further customize the TreeList. Read more about the editing feature of the TreeList...

Paging

The TreeList enables you to split its content into pages by adding a pager and using its extensive set of configuration options such as implementing a responsive behavior, customizing its appearance, defining the space between its elements, and more. Read more about the pager options of the TreeList...

Sorting

The TreeList supports a number of sorting options including sorting and unsorting single and multiple columns, pre-sorting its data records, setting the sorting direction, and more. Read more about the sorting options of the TreeList...

Filtering

The TreeList provides options for displaying only those data records which meet specified criteria and also for additionally customizing its filtering behavior by using its built-in filter templates or reusable custom filter components. Read more about filtering the TreeList records...

Export to PDF and Excel

When implementing the TreeList export to PDF, you can set the fonts, the exact portion and layout of the exported content, also customize the columns and other elements of the output result. When exporting to Excel, you can export specific data and customize the exported columns. Read more on exporting the TreeList to PDF and exporting the TreeList to Excel...

Columns Options

The TreeList provides an extensive collection of column configuration options, such as:

Hiding columns—Allows you to show or hide columns.
Spanning columns —Spanning of the row content over multiple cells of data.
Setting multi-column headers—Grouping columns under a common header.
Column menu for quick actions—You can show or hide columns, filter, sort, and group them.
Locking (freezing) columns—Allows you to display specific column data at all times.
Reordering columns—You can reorder any column and with any available TreeList feature, including locked columns.
Resizing columns—Allows you to resize columns in real-time by dragging the edges of the column headers.
Customizing columns—Allows you to customize the columns of the TreeList using the available template directives.

Row Reordering

The Angular TreeList enables quick and easy row reordering via dragging specified hint element and dropping it at the desired position. The component provides a designated attribute that enables the row reordering functionality, which handles all related data updates automatically. Read more about the row reordering functionality of the TreeList...

Selection

The Angular TreeList allows the user to select single or multiple cells and rows. It offers various ways to select data items, including directly clicking on a row or via a checkbox column. The TreeList provides a rich API for customizing the selection logic and persisting the selected items based on specific requirements. Read more about the selection feature of the TreeList...

Virtualization

The TreeList supports a virtual scroll mode for its row data, which means that the component dynamically renders only a portion of the rows. This virtualization approach boosts the performance of the component when it has to display large data tables. Read more about the virtualization feature of the TreeList...

Styling

The TreeList provides built-in options for customizing the appearance and changing the default layout of its columns and rows, as well as the individual cells. Read more about the built-in styling options of the TreeList...

Our components are designed to look great out of the box, but we understand that every application is different. That's why the Progress Design System Kit provides resources to help you customize the look and feel of your Kendo UI for Angular TreeList component. If time is of the essence, our ThemeBuilder application can help you quickly and seamlessly modify the component's appearance.

Globalization

The Kendo UI for Angular TreeList supports globalization to ensure that it can fit well in any application, no matter what languages and locales need to be supported. Additionally, the TreeList supports rendering in a right-to-left (RTL) direction. Read more about the globalization of the TreeList...

Accessibility

The TreeList is accessible for screen readers and supports WAI-ARIA attributes. Read more about the accessibility of the TreeList...

The TreeList supports a number of keyboard shortcuts which allow users to accomplish various commands. Read more about the keyboard navigation of the TreeList...

Trial Version of Kendo UI for Angular

The Kendo UI for Angular TreeList is part of the Kendo UI for Angular library. Kendo UI for Angular offers a 30-day trial with a full-featured version of the library—no restrictions! What’s more, you are eligible for full technical support during your trial period in case you have any questions. Sign up for a free 30-day trial of Kendo UI for Angular.

Support Options

For any questions about the use of the Kendo UI for Angular TreeList, or any of our other components, there are several support options available:

Kendo UI license holders and anyone in an active trial can take advantage of the Kendo UI for Angular outstanding customer support delivered by the actual developers who built the library. To submit a support ticket, use the Kendo UI support system.
Kendo UI for Angular forums are part of the free support you can get from the community and from the Kendo UI team on all kinds of general issues.
Kendo UI for Angular feedback portal and Kendo UI for Angular roadmap provide information on the features in discussion and also the planned ones for release.
Kendo UI for Angular uses GitHub Issues as its bug tracker and you can submit any related reports there. Also, check out the closed list.
Of course, the Kendo UI for Angular team is active on StackOverflow as well and you can find a wealth of questions and answers there.
Need something unique that is tailor-made for your project? Progress offers its Progress Services group that can work with you to create any customized solution that you might need.