--- product: "AG Grid" title: "PDF Export - Hyperlinks" description: "PDF Export can add external URI hyperlinks to body cells and custom content. Hyperlinks are written as native PDF link annotations, so they remain clickable when the document is opened in a compatible PDF viewer." enterprise: true framework: angular version: "36.3.0" related: - title: "Styles" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-styles/" - title: "Languages" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-languages/" - title: "Extra Content" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-extra-content/" - title: "Customising Content" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-customising-content/" - title: "Images" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-images/" - title: "Watermarks" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-watermarks/" - title: "Rows" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-rows/" - title: "Columns" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-columns/" - title: "Master Detail" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-master-detail/" - title: "Page Setup" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-page-setup/" - title: "API Reference" url: "https://www.ag-grid.com/archive/36.3.0/angular-data-grid/pdf-export-api/" llms: "https://www.ag-grid.com/archive/36.3.0/llms.txt" --- # PDF Export - Hyperlinks PDF Export can add external URI hyperlinks to body cells and custom content. Hyperlinks are written as native PDF link annotations, so they remain clickable when the document is opened in a compatible PDF viewer. Supported URI schemes are `http`, `https`, `mailto`, and `tel`. Other schemes and relative URLs are omitted from the exported PDF. ## Grid Cell Hyperlinks Use `processCellHyperlinkCallback` to return the URI for an exported body cell. The callback receives the final exported text together with its row node and column. ```ts this.gridApi.exportDataAsPdf({ processCellHyperlinkCallback: (params) => { return params.column.getColId() === 'url' ? params.value : undefined; }, }); ``` Adding a hyperlink does not change the appearance of the cell. Use `cellStyle` or `processStyleCallback` when linked text should use a different colour or other PDF styling. ## Custom Content Hyperlinks Set `PdfCellData.hyperlink` when adding a link to `prependContent`, `appendContent`, or `getCustomContentBelowRow`: ```ts this.gridApi.exportDataAsPdf({ appendContent: [ [ { data: { value: 'AG Grid Documentation', hyperlink: 'https://www.ag-grid.com/documentation/', }, style: { color: '#358ccb', }, }, ], ], }); ``` The hyperlink is applied to each visible line of the exported cell text. When wrapped content continues onto another page, the corresponding link annotations are added to every page containing that text. #### PDF Export - Hyperlinks ```ts import { Component } from "@angular/core"; import { AgGridAngular } from "ag-grid-angular"; import { CellStyleModule, ClientSideRowModelModule, ColDef, ColGroupDef, GridApi, GridOptions, GridReadyEvent, ModuleRegistry, PdfExportParams, enableDevValidations, } from "ag-grid-community"; import { ColumnMenuModule, ContextMenuModule, PdfExportModule, } from "ag-grid-enterprise"; import "./styles.css"; if (process.env.NODE_ENV !== "production") { // Enable extended validations only for development enableDevValidations(); } ModuleRegistry.registerModules([ CellStyleModule, ClientSideRowModelModule, PdfExportModule, ColumnMenuModule, ContextMenuModule, ]); @Component({ selector: "my-app", standalone: true, imports: [AgGridAngular], template: `
`, }) export class AppComponent { private gridApi!: GridApi; columnDefs: ColDef[] = [ { field: "company", headerName: "Company" }, { field: "url", headerName: "Website", cellStyle: { color: "#358ccb" }, }, ]; defaultColDef: ColDef = { flex: 1, minWidth: 160, }; defaultPdfExportParams: PdfExportParams = { columnWidth: ({ column }) => (column.getColId() === "url" ? 300 : 160), processCellHyperlinkCallback: (params) => params.column.getColId() === "url" ? params.value : undefined, appendContent: [ [ { data: { value: "AG Grid Documentation", hyperlink: "https://www.ag-grid.com/documentation/", }, mergeAcross: 1, style: { color: "#358ccb", alignment: "center", padding: 8, }, }, ], ], }; rowData: any[] | null = [ { company: "Google", url: "https://www.google.com" }, { company: "Adobe", url: "https://www.adobe.com" }, { company: "The New York Times", url: "https://www.nytimes.com" }, { company: "GitHub", url: "https://github.com" }, { company: "Microsoft", url: "https://www.microsoft.com" }, ]; onBtExport() { this.gridApi.exportDataAsPdf(); } onGridReady(params: GridReadyEvent) { this.gridApi = params.api; } } ``` [Live example: PDF Export - Hyperlinks](https://www.ag-grid.com/archive/36.3.0/examples/pdf-export-hyperlinks/pdf-export-hyperlinks/angular/) ## API ### Export Options See below the functions on the `PdfExportParams` interface to customise exported grid values. | Property | Type | Required | Default | Description | | --- | --- | --- | --- | --- | | `processCellHyperlinkCallback` | `Function` | | | Callback that provides an external URI for an exported body cell. The returned URI is added to the PDF as a clickable link annotation. | | `prependContent` | `PdfCustomContent` | | | Content to put at the top of the exported sheet. | | `appendContent` | `PdfCustomContent` | | | Content to put at the bottom of the exported sheet. | | `getCustomContentBelowRow` | `Function` | | | A callback function to return content to be inserted below a row in the export. | ### PdfCellHyperlinkCallbackParams Properties available on the `PdfCellHyperlinkCallbackParams<TData = any, TContext = any>` interface. | Property | Type | Required | Default | Description | | --- | --- | --- | --- | --- | | `value` | `string` | | | The final text exported for the cell. | | `accumulatedRowIndex` | `number` | | | The 1-based index of the current exported row. | | `node` | [`IRowNode`](https://www.ag-grid.com/archive/36.3.0/angular-data-grid/row-object/) | | | The row node for the exported cell. | | `column` | [`Column`](https://www.ag-grid.com/archive/36.3.0/angular-data-grid/column-object/) | | | The current column. | | `api` | [`GridApi`](https://www.ag-grid.com/archive/36.3.0/angular-data-grid/grid-api/) | | | The grid api. | | `context` | [`TContext`](https://www.ag-grid.com/archive/36.3.0/angular-data-grid/typescript-generics/#context-tcontext) | | | Application context as set on `gridOptions.context`. | ### PdfCellData Properties available on the `PdfCellData` interface. | Property | Type | Required | Default | Description | | --- | --- | --- | --- | --- | | `value` | `string \| null` | Yes | | The value of the cell. | | `hyperlink` | `string` | | | External URI opened when the exported cell text is selected. | | `image` | `PdfImage` | | | Image rendered alongside the cell value. |