Question

在我的角度应用程序中，我有一个组件，在模板中我有一个打印链接点击，我必须启用打印功能。我在我的HTML中尝试这样的事情 -

<div>
<a href="#" (click)="print()">PRINT</a>
</div>

并在.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();
}

这样可以，但它会打开一个新的打印窗口。有没有，我可以在同一个窗口。我也试过了 -

<a href="javascript:window.print();">Print</a>

但上述两种方法都不起作用。任何想法如何让我的页面以angular2打印。

Answer 1

使用onclick调用print（）。

试试这个<a href="#" onclick="print();">Print</a>

Answer 2

这很好用。我们将能够打印特定组件但是我们需要在document.write函数中添加标签内的样式。

Angular2-单击PRINT链接在同一窗口中启用打印功能

2 个答案: