Angular TreeGrid

In this blog we will introduce the capabilities of our Angular TreeGrid.

The TreeGrid component is a kind of grid which is used to display the elements in a tree like structure. The data of the grid is grouped by the first column, the items of which can be opened like parent nodes of a Tree component. TreeGrids are often used to display properties or configuration settings.

Angular TreeGrid basic capabilities

Our Angular TreeGrid can be bound to local data (such as an array for example), XML, Nested XML, JSON, Nested JSON, CSV and Tab data.

Our TreeGrid for Angular supports alphabetical and numeric sorting. The sort order can be from A-Z or from Z-A.

Filtering is also supported. In addition the standard filtering options (empty, not empty, contains, does not contain, starts with, ends with) you can also enable advanced filtering (where you can have several filters) and search fields.

You can also enable paging. With the standard paging you have a go to page, show rows combobox and arrow buttons to move to the next or the previous page.

The data of the TreeGrid can be exported to Excel, XML, CSV, TSV, JSON, PDF and HTML formats.

Angular TreeGrid

Angular TreeGrid advanced capabilities

The TreeGrid enables you to display aggregates. The aggregates are displayed at the bottom of the TreeGrid. By default you have Min, Max and Count. You can also have aggregate templates and manual aggregates.

Our Angular TreeGrid supports Row Details. The row details will enable you to create an extra row for each data record.

You can also have conditional formatting. This will enable you to put different background colors on certain cells depending on a given condition.

In a similar way the conditional rendering feature enables you to customize the TreeGrid’s cell rendering.

Our Angular TreeGrid supports in addition data printing. The data printing uses the browser printing functionality to print the HTML of the TreeGrid.

Localization, Keyboard Navigation and Right-To-Left are also supported.

You can find a demo of the TreeGrid here : angular tree grid

About admin

This entry was posted in ANGULAR, Angular 2, angular 4, angular 5, ANGULAR GRID, angular tree, Angular5, AngularJS and tagged , , . Bookmark the permalink.

Leave a Reply