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');
}
}
|