Kendo UI PDF Export component for Angular

Question

I'm using Kendo for exporting a component into PDF. The problem is it doesn't print properly and the PDF generator can't handle some elements on my page. Can I resolve this or do I need to make a separate view for this PDF generator?

Kendo pdfexport

Answer 1

I guess you can use a Page Template to customize your PDF output. I´m not sure which elements are not handle properly but definitely you have more power with page template.

All you need is to nest a <ng-template> tag with the kendoGridPDFTemplate directive inside the <kendo-grid-pdf> component.

Here is a Telerik example: https://stackblitz.com/run/

and some documentation: https://www.telerik.com/kendo-angular-ui/components/grid/export/pdf-export/#toc-specifying-page-template

Answer 2

Seems like you are missing some font. Do you have it added in your domain? Check this link: https://www.telerik.com/kendo-angular-ui/components/pdfexport/embedded-fonts/

Also, if you want to change only the style of the printed view, you can use the .k-pdf-export class in your css to change the view as you wish, without having to change all the page. For example, hidden the buttons:

.k-pdf-export button {
   visibility: hidden; 
}

Live example here:

https://stackblitz.com/edit/angular-stack-55588085-printpdf?file=styles.css