在Angular 2中打印Html模板（Angular 2中的ng-print） [英] Print Html template in Angular 2 (ng-print in Angular 2)
本文介绍了在Angular 2中打印Html模板（Angular 2中的ng-print）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想在角度2中打印HTML模板。我已经探讨了这个问题我在angularjs中得到了解决方案1 打印Html Angularjs中的模板1
I want to print HTML template in angular 2. I had explored about this I got solution in angularjs 1 Print Html Template in Angularjs 1
任何建议都将受到赞赏
推荐答案
这就是我在angular2中完成的方式（它类似于 plunkered 解决方案）在你的HTML文件中：
That's how I've done it in angular2 (it is similar to that plunkered solution) In your HTML file:
<div id="print-section">
// your html stuff that you want to print
</div>
<button (click)="print()">print</button>
并在您的TS文件中：
print(): void {
let printContents, popupWin;
printContents = document.getElementById('print-section').innerHTML;
popupWin = window.open('', '_blank', 'top=0,left=0,height=100%,width=auto');
popupWin.document.open();
popupWin.document.write(`
<html>
<head>
<title>Print tab</title>
<style>
//........Customized style.......
</style>
</head>
<body onload="window.print();window.close()">${printContents}</body>
</html>`
);
popupWin.document.close();
}
更新：
您也可以快捷方式使用 ngx-print 库，用于更少的不一致编码（混合JS和TS）以及更多现成的可控和安全打印案例。
UPDATE:
You can also shortcut the path and use merely ngx-print library for less inconsistent coding (mixing JS and TS) and more out-of-the-box controllable and secured printing cases.
这篇关于在Angular 2中打印Html模板（Angular 2中的ng-print）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
