我正在尝试在Angular中使用jspdf库的addHTML函数,并已安装html2Canvas,但是出现了错误。
这是我的demo.component.ts文件。
当我点击下载按钮时,会出现以下错误:
错误:您需要https://github.com/niklasvh/html2canvas或https://github.com/cburgmer/rasterizeHTML.js 我已经在demo.component.ts中导入了html2canvas,并尝试使用formHTML,它可以工作,但我想特别使用addHTML函数或html2canvas。
任何帮助将不胜感激。
这是我的demo.component.ts文件。
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import * as jsPDF from 'jspdf';
import * as html2canvas from "html2canvas";
@Component({
selector: 'app-demo',
templateUrl: './demo.component.html',
styleUrls: ['./demo.component.scss']
})
export class DemoComponent implements OnInit {
@ViewChild('content') content:ElementRef;
constructor() { }
ngOnInit() {}
download() {
console.log("vijay")
let doc = new jsPDF('p','pt','a4');
let specialElementHandlers = {
'#editor': function (element, renderer) {
return true;
}
};
let content = this.content.nativeElement.innerHTML;
// doc.fromHTML( content, 15, 15, {
// 'width': 200,
// 'elementHandlers': specialElementHandlers
// });
doc.addHTML(document.getElementById('content'),function() {
doc.save('web.pdf');
});
}
}
这是我的 demo.component.html 文件。
<div #content>
<h2>HTML Table</h2>
<table>
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Ernst Handel</td>
<td>Roland Mendel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>Helen Bennett</td>
<td>UK</td>
</tr>
<tr>
<td>Laughing Bacchus Winecellars</td>
<td>Yoshi Tannamuri</td>
<td>Canada</td>
</tr>
<tr>
<td>Magazzini Alimentari Riuniti</td>
<td>Giovanni Rovelli</td>
<td>Italy</td>
</tr>
</table>
</div>
<button (click)="download()" > Download </button>
当我点击下载按钮时,会出现以下错误:
错误:您需要https://github.com/niklasvh/html2canvas或https://github.com/cburgmer/rasterizeHTML.js 我已经在demo.component.ts中导入了html2canvas,并尝试使用formHTML,它可以工作,但我想特别使用addHTML函数或html2canvas。
任何帮助将不胜感激。