# Angular Data Grid Excel Export

Export your Grid data to professional Excel reports with full control over formatting, styling, and content.

The Grid 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_GRID_EXCEL_EXPORT` utility array and nest the [`kendo-grid-excel`](https://www.telerik.com/kendo-angular-ui/components/grid/api/excelcomponent) component inside `kendo-grid` tags.
Trigger the export using the [`kendoGridExcelCommand`](https://www.telerik.com/kendo-angular-ui/components/grid/api/excelcommanddirective) directive, [`kendoGridExcelTool`](https://www.telerik.com/kendo-angular-ui/components/grid/toolbar/grid-toolbar) toolbar tool, or [`saveAsExcel`](https://www.telerik.com/kendo-angular-ui/components/grid/api/gridcomponent#saveasexcel) method.

```html
<kendo-grid>
    <kendo-grid-column></kendo-grid-column>
    ...
    <kendo-grid-excel></kendo-grid-excel>
</kendo-grid>
```

The following example demonstrates the Excel export functionality of the Grid.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/basic/source.txt)

## Controlling the Exported Data

By default, the Grid exports only the currently visible data—the current page when paging is enabled, or a batch of rows when virtual scrolling is used. However, you often need to export a different data set than what appears on screen, such as all records across all pages or only selected rows.

The [`fetchData`](https://www.telerik.com/kendo-angular-ui/components/grid/api/excelcomponent#fetchdata) callback function gives you complete control over which data appears in the Excel file. This function receives the current Grid data and lets you transform or replace it before export.

### Exporting Different Data Sets

You can use the [`fetchData`](https://www.telerik.com/kendo-angular-ui/components/grid/api/excelcomponent#fetchdata) callback to export all data of the Grid or various subsets based on your specific requirements.

```html
<kendo-grid>
    <kendo-grid-column></kendo-grid-column>
    ...
    <kendo-grid-excel [fetchData]="customData"></kendo-grid-excel>
</kendo-grid>
```

The following example demonstrates how to export all data when the Grid is paginated. Instead of exporting only the visible page, the export includes all records. The same approach works when virtual scrolling is enabled.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/all-pages/source.txt)

The `fetchData` function must return an [`ExcelExportData`](https://www.telerik.com/kendo-angular-ui/components/excel-export/api/excelexportdata) object or array. The function receives the current data from the Grid and lets you transform it before export. This enables various scenarios:

* Export all data—Retrieve the complete data set regardless of paging or virtual scrolling
* [Export selected rows only](https://www.telerik.com/kendo-angular-ui/components/knowledge-base/export-selected-rows-excel)—Export only the rows that users have selected in the Grid
* [Export filtered data](https://www.telerik.com/kendo-angular-ui/components/knowledge-base/grid-export-filtered-data-excel)—Export data based on specific filtering criteria
* Export processed data—Apply custom sorting, filtering, or transformations before export

### Exporting Data from Remote Sources

You can use the [`fetchData`](https://www.telerik.com/kendo-angular-ui/components/grid/api/excelcomponent#fetchdata) callback to export data from remote servers or APIs. This is especially useful when the Grid displays paginated or virtualized data, but you need to export the complete data set.

The callback function supports asynchronous data loading by accepting `Observable` or `Promise` return types, allowing you to load data from remote sources before the export begins.

```html
<kendo-grid-excel [fetchData]="allData"></kendo-grid-excel>
```

```typescript
public allData = (): Observable<GridDataResult> => {
    return this.service.queryAll(this.state);
};
```

The following example demonstrates how to export all data from a remote source. The Grid displays paginated data, but clicking the Export button fetches the complete data set from the server and exports it to Excel.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/all-pages-observable/source.txt)

## Exporting Specific Columns

By default, the Grid exports all visible columns. To export a different set of columns than what the Grid displays, define custom columns inside the `<kendo-grid-excel>` component using [`<kendo-excelexport-column>`](https://www.telerik.com/kendo-angular-ui/components/excel-export/api/columncomponent) and [`<kendo-excelexport-column-group>`](https://www.telerik.com/kendo-angular-ui/components/excel-export/api/columngroupcomponent).

Use this feature to create streamlined reports that exclude technical fields like IDs or internal codes, reorganize columns for better presentation, or include additional computed fields specific to the export that aren't displayed in the Grid.

The following example demonstrates how to export a custom set of columns.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/customize-columns/source.txt)

## Formatting Exported Cells

By default, the Grid 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`](https://www.telerik.com/kendo-angular-ui/components/excel-export/api/columncomponent#celloptions) property of the `kendo-excelexport-column` component.

The following example demonstrates how to format exported Excel cells using the `cellOptions` property.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/celloptions-format/source.txt)

The `cellOptions` property allows you to control:

* Data formatting—Apply currency, date, percentage, or custom number formats through the [`format`](https://www.telerik.com/kendo-angular-ui/components/excel-export/api/celloptions#format) property. For more details on Excel format patterns, refer to the Microsoft [Create a custom number format](https://support.microsoft.com/en-us/office/create-a-custom-number-format-78f2a361-936b-4c03-8772-09fab54be7f4?ui=en-us\&rs=en-us\&ad=us) page.
* Text styling—Make text bold, italic, or underlined to emphasize important data.
* Colors—Set background and text colors to highlight specific values or create visual distinction.
* Alignment—Control horizontal and vertical text alignment within cells.
* Fonts—Specify font family and size to match your brand or reporting standards.
* Borders—Add borders to cells for better visual separation.
* Text wrapping—Enable text wrapping for cells with longer content.

## Customizing Generated Workbooks

The [`excelExport`](https://www.telerik.com/kendo-angular-ui/components/grid/api/gridcomponent#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 how to customize the exported workbook by handling the `excelExport` event.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/customize-workbook/source.txt)

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

## Exporting Master-Detail Grids

By default, the Grid does not export detail template content to Excel for security reasons. Detail templates can contain custom HTML and JavaScript that cannot be safely converted to Excel format. However, you can export master-detail data by handling the [`excelExport`](https://www.telerik.com/kendo-angular-ui/components/grid/api/gridcomponent#excelexport) event and adding the detail Grid data to the workbook.

The `excelExport` event gives you access to the workbook structure before it is saved. You can iterate through the master Grid rows and retrieve the detail data for each row. Then insert the detail data as additional rows in the exported Excel document. This approach lets you create exports that include both master and detail information in a structured format.

The following example demonstrates how to retrieve data for all detail Grids and append it to the exported workbook.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/export-detail-grids-to-excel/source.txt)

## 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`](https://www.telerik.com/kendo-angular-ui/components/grid/api/gridcomponent#saveasexcel) method on the Grid component instance to initiate the export operation.

This approach is useful when you need to integrate the export functionality with custom buttons, menu items, or automated workflows. You can also combine it with other operations, such as validating data or applying filters before triggering the export.

The following example demonstrates how to trigger the Excel export using a custom button outside the Grid.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/save-as-excel/source.txt)

## Making Groups Collapsible

When you export grouped Grid data to Excel, you can make each group collapsible to create a more organized and navigable document. The [`collapsible`](https://www.telerik.com/kendo-angular-ui/components/grid/api/excelcomponent#collapsible) option creates [a collapsible outline](https://support.office.com/en-us/article/outline-group-data-in-a-worksheet-08ce98c4-0063-4d42-8ac7-8278c49e9aff) in Excel that allows users to expand and collapse groups directly in the spreadsheet.

This feature is particularly useful when exporting large data sets with multiple levels of grouping. Users can hide detailed rows and focus on summary information, then expand specific groups when they need to see the underlying data.

The following example demonstrates how to export grouped data with collapsible groups.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/grid/excel/collapsible/source.txt)

## Known Limitations

* The Grid 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 `fetchData` callback.
* The Grid does not export detail templates. To export master-detail Grid refer to the [Exporting Master-Detail Grids](https://www.telerik.com/kendo-angular-ui/components/grid/export/excel-export#exporting-master-detail-grids) section.
* The Grid does not apply column formats during export. Excel uses its own format system. Apply formatting directly to exported columns using the [`cellOptions`](https://www.telerik.com/kendo-angular-ui/components/excel-export/api/columncomponent#celloptions) property. For details on Excel format patterns, refer to the Microsoft [Create a custom number format](https://support.microsoft.com/en-us/office/create-a-custom-number-format-78f2a361-936b-4c03-8772-09fab54be7f4?ui=en-us\&rs=en-us\&ad=us) page.
* Excel files have system-specific size limits. For large data sets, use a server-side solution like [Document Processing library](https://www.telerik.com/document-processing-libraries) to generate Excel files.

## Suggested Links

* [Exporting the Grid to PDF](https://www.telerik.com/kendo-angular-ui/components/grid/export/pdf-export)
* [Exporting the Grid to CSV](https://www.telerik.com/kendo-angular-ui/components/grid/export/csv-export)
* [Printing the Grid](https://www.telerik.com/kendo-angular-ui/components/grid/export/print-grid)
* [API Reference of the GridComponent](https://www.telerik.com/kendo-angular-ui/components/grid/api/gridcomponent)
* [API Index of the Grid](https://www.telerik.com/kendo-angular-ui/components/grid/api)
