Чтобы экспортировать Kendo UI Grid в PDF в приложении Angular, вы можете выполнить следующие действия:
-
Установите необходимые зависимости:
npm install @progress/kendo-angular-pdf-export --save -
Импортируйте необходимые модули в файл модуля Angular (например,
app.module.ts):import { PDFExportModule } from '@progress/kendo-angular-pdf-export'; @NgModule({ imports: [ // other imports PDFExportModule ], // ... }) export class AppModule { } -
Используйте компонент
kendo-pdf-exportв шаблоне компонента Angular:<kendo-pdf-export #pdfExport> <!-- Your Kendo UI Grid here --> <kendo-grid [data]="gridData" [columns]="gridColumns"></kendo-grid> </kendo-pdf-export> <button (click)="exportToPDF()">Export to PDF</button> -
В файле компонента Angular (например,
app.comComponent.ts) определите необходимые переменные и методы:import { Component, ViewChild } from '@angular/core'; import { PDFExportComponent } from '@progress/kendo-angular-pdf-export'; @Component({ // component properties }) export class AppComponent { @ViewChild('pdfExport', { static: false }) pdfExport: PDFExportComponent; gridData: any[]; // your grid data gridColumns: any[]; // your grid columns exportToPDF() { this.pdfExport.save(); } }
При нажатии кнопки «Экспорт в PDF» сетка пользовательского интерфейса Kendo будет экспортирована в файл PDF.