Angular 2-如何将html导出为pdf? [英] Angular 2 - How to export html to pdf?
本文介绍了Angular 2-如何将html导出为pdf?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何创建一个下载按钮,以将HTML div内容另存为我的angular2项目中的PDF文件?
这是HTML内容
P.S.我尝试了此 jsPDF示例,但它根本没有为我工作
预先感谢
解决方案
尝试如下操作:
在div之外创建一个按钮
<button (click)="downloadPdf()">Download PDF</button>
单击后,它将在您的组件中调用此函数:
downloadPdf() {
let doc = new jsPDF();
doc.addHTML(document.getElementById("obrz"), function() {
doc.save("obrz.pdf");
});
}
How do I make a download button for saving HTML div content as PDF file inside my angular2 project?
This is the HTML content
<div id="obrz">
<br><br>
<p class="float-right font-weight-bold">Образац ЗПО</p>
<br>
<p class="float-left font-weight-bold">Подаци о обвезнику:</p>
<br>
<div class="row" style="width:100%">
<div class="col-md-2"><p>Порески обвезник:</p></div>
<div class="col-md-10"><input value="{{userModel.imeIprezime}}" type="text" class="form-control form-control-sm border-1 border-top-0 border-right-0 border-left-0" style="border-bottom: 1px solid black"></div>
<div class="col-md-2"><p>ПИБ:</p></div>
<div class="col-md-10"><input value="{{userModel.PIB}}" type="text" class="form-control form-control-sm border-1 border-top-0 border-right-0 border-left-0" style="border-bottom: 1px solid black"></div>
<div class="col-md-2"><p>Адреса:</p></div>
<div class="col-md-10"><input value="{{userModel.ulica + ' ' + userModel.broj + ' ' + userModel.grad}}" type="text" class="form-control form-control-sm border-1 border-top-0 border-right-0 border-left-0" style="border-bottom: 1px solid black"></div>
<div class="col-md-2"><p>Општина:</p></div>
<div class="col-md-10"><input value="{{userModel.opstina}}" type="text" class="form-control form-control-sm border-1 border-top-0 border-right-0 border-left-0" style="border-bottom: 1px solid black"></div>
</div>
<br>
</div>
P.S. I tried this jsPDF example, but it simply doesn't work for me
Thanks in advance
解决方案
Try something like this:
Create a button outside of your div
<button (click)="downloadPdf()">Download PDF</button>
When clicked, it will call this function in your component:
downloadPdf() {
let doc = new jsPDF();
doc.addHTML(document.getElementById("obrz"), function() {
doc.save("obrz.pdf");
});
}
这篇关于Angular 2-如何将html导出为pdf?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文