Angular TreeList Excel Export
The Angular TreeList provides the ability to export the TreeList data to professional Excel reports with full control over formatting, styling, and content.
The TreeList lets you create formatted workbooks with custom columns, styled cells, and computed fields. Export all data or just what's visible, apply currency and date formatting, and customize every aspect of the generated document.
Getting Started
Import the KENDO_TREELIST_EXCEL_EXPORT utility array and nest the <kendo-treelist-excel> component inside <kendo-treelist> tags.
Trigger the export using the kendoTreeListExcelCommand directive, kendoTreeListExcelTool toolbar tool, or the saveAsExcel method.
<kendo-treelist>
<kendo-treelist-column></kendo-treelist-column>
...
<kendo-treelist-excel></kendo-treelist-excel>
</kendo-treelist>The following example demonstrates the Excel export functionality of the TreeList.
Controlling the Exported Data
By default, the TreeList exports its current data. To export data that is different from the current TreeList data, use the fetchData callback function. This function receives the current TreeList data and lets you transform or replace it before export. The function returns an ExcelExportData object.
The following example exports only the staff nodes, excluding department headers, by filtering the data inside the fetchData callback.
Exporting Data from Remote Sources
If the export data needs to be asynchronously loaded, you can set an Observable to the data field. This is especially useful when the TreeList displays paginated or virtualized data, but you need to export the complete data set.
The following example loads and filters organizational data based on position-specific criteria from a remote source before exporting.
Exporting All Pages
By default, the TreeList exports all pages of the current data. To export only the current page, set the allPages option to false.
The following example demonstrates exporting a paged TreeList with only the current page visible in the Excel file.
Expanded State
By default, the TreeList expands all items during export. To export the data with the currently expanded items, set expandAll to false.
The following example demonstrates how setting expandAll to false preserves the current expansion state in the exported file instead of expanding the entire hierarchy.
Exporting Specific Columns
By default, the TreeList exports all visible columns. To export a different set of columns than what the TreeList displays, define custom columns inside the <kendo-treelist-excel> component using <kendo-excelexport-column> and <kendo-excelexport-column-group>.
Use this feature to create streamlined reports that exclude technical fields like IDs, reorganize columns for better presentation, or include additional computed fields specific to the export.
The following example demonstrates exporting additional columns (such as "Years Experience") that are not displayed in the TreeList.
Formatting Exported Cells
By default, the TreeList exports raw data values without applying any formatting. The export process works with the underlying data rather than the visual content from cell templates, so you must apply formatting directly to the exported columns.
To customize the appearance and formatting of exported cells, use the cellOptions property of the <kendo-excelexport-column> component. To apply specific currency or percentage format, use the format option. For more details on Excel format patterns, refer to the Microsoft Create a custom number format page.
<kendo-treelist-excel fileName="MedicalStaff.xlsx">
<kendo-excelexport-column field="name" title="Name">
</kendo-excelexport-column>
<kendo-excelexport-column
field="hireDate"
title="Hire Date"
[cellOptions]="{ format: 'dd/mm/yyyy' }"
>
</kendo-excelexport-column>
</kendo-treelist-excel>Customizing Generated Workbooks
The excelExport event provides extensive control over the generated Excel document. The event exposes the complete workbook configuration, which you can modify and adjust based on your requirements before the document is saved.
The following example demonstrates adding alternating row colors to the exported workbook using the excelExport event.
Handling the excelExport event allows you to perform advanced customization of the exported Excel document, such as:
- Add custom rows at the top or bottom of the document for headers, summary information, or footers
- Freeze rows, merge cells to create titles or group related data
- Modify existing cell values, styles, and formatting
- Add or remove sheets from the workbook
- Apply custom column widths and row heights
- Set document properties like author, title, and creation date
- Add formulas and calculations to cells
Triggering Export Externally
Besides using the built-in export button or toolbar tool, you can trigger the Excel export programmatically from your own custom UI elements or business logic. Call the saveAsExcel method on the TreeList component instance to initiate the export operation.
The following example demonstrates triggering the Excel export from a custom button outside the TreeList toolbar.
Making Item Levels Collapsible
When you export TreeList data to Excel, you can make each hierarchy level collapsible to create a more organized and navigable document. The collapsible option creates a collapsible outline for each item level.
The option is only applicable if the TreeList has footers.
The following example demonstrates creating collapsible outlines with aggregate footers to allow users to expand and collapse staff by department or role in the exported file.
Known Limitations
- The TreeList does not export cell templates or column templates. The export includes only the raw data values. To customize the exported content, transform your data before export or use the
fetchDatacallback. - The TreeList does not apply column formats during export. Excel uses its own format system. Apply formatting directly to exported columns using the
cellOptionsproperty. For details on Excel format patterns, refer to the Microsoft Create a custom number format page. - Excel files have system-specific size limits. For large data sets, it is highly recommended that you use a server-side solution.
- When you export the TreeList to Excel in older browsers, such as Internet Explorer 9 and Safari, you have to implement a server proxy. For more information, refer to the
proxyUrlconfiguration.