First of all you need to install following javascript libraries:
|
1 2 |
npm install jspdf --save npm install @types/jspdf --save |
Then add following in angular-cli.json:
|
1 |
"scripts": [ "../node_modules/jspdf/dist/jspdf.min.js" ] |
Create a component
|
1 |
ng g component pdf |
html:
|
1 |
<button (click)="download()">download </button> |
component ts:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
import { Component, OnInit, Inject } from '@angular/core'; import * as jsPDF from 'jspdf' @Component({ selector:'app-pdf', templateUrl:'./pdf.component.html', styleUrls: ['./pdf.component.css'], providers: [ { provide: 'Window', useValue: window } ] }) export class PdfComponent implements OnInit { constructor( @Inject('Window') private window: Window, ) { } ngOnInit() { } download() { vardoc = new jsPDF(); doc.text(20, 20, 'Hello world!'); doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.'); doc.addPage(); doc.text(20, 20, 'http://www.coding4developers.com/'); // Save the PDF doc.save('Test.pdf'); } } |
