Question

我想创建自己的简单打印，我将div的id传递给函数并打印该div。到目前为止，我已经能够通过bootstrap实现这一目标。

print(): void{
        var divToPrint = document.getElementById("table");

        let printWindow = window.open("");
        printWindow.document.write('<html><head><link rel="stylesheet"  href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"  integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"></head><body>');

        printWindow.document.write(divToPrint.outerHTML);
        printWindow.document.write('</body></html>');

        setTimeout(function(){printWindow.print();printWindow.close();},100);
 }

我从CDN加载了boostrap css。

但是，我想用Angular Material完成同样的工作。所以，在我的资源文件夹中，我复制了我正在使用的主题（pink-bluegrey.css）并更新了链接

href="assets/pink-bluegrey.css"

我的应用程序可以获取样式表，但是仍有问题。工作表未正确应用或我仍然缺少其他脚本/工作表。

从应用程序

从新的打印窗口

Answer 1

我已决定是否需要打印目前在Angular Material中显示的任何内容，我只是将其转换为bootstrap并打印出我在原始问题中解释的内容。

我查看了jspdf和html2canvas，但它们都不可靠，并且根据文档无法正常工作。

我还添加了Material Design Lite（css和js），因此我可以将材质和引导程序结合起来。

角度材质 - 如何将CSS样式传递给新窗口

1 个答案: