Question

我需要一张表格作为pdf打印，而不是忽略与表格相关的CSS。我也在使用angularjs。我正在寻找不同的方式，我正在尝试jsPDF。

在主页面（rollup.html）上，我有一个链接，应该将表格导出为PDF格式。

<a style="float: right;"  href="genPDF()">PDF TEST</a>

在控制器中的js（rollup.js）中，我有genPDF函数，它应该显示id #testDiv中包含的内容。

app.controller('Rollup', function($scope, $rootScope, $http, $uibModal, headersvc, locFiltersvc) {
....
function genPDF(){
    html2canvas(document.getElementById("testDiv"), {
        onrendered: function (canvas) {
            var img = canvas.toDataURL("image/png");
            var doc = new jsPDF();
            doc.addImage(img, 'JPEG',20,20);
            doc.save('test.pdf');
        }
    });
}
});

当然我将testDiv分配给包含我想要打印的表格的div（位于route.html中）

<div class="content-div" style="overflow: visible;" id="testDiv">
....
</div>

我有另一个按钮，可以使用ng-click为其余选项卡工作，并从其他表中广播没有css的简单数据。我不确定是否应该尝试使用ng-click打印表格并广播表格数据，但也要使用所有css。

        <li style="float: right;">      
            <button ng-click="printDiv('rollup-tab')">Printer Friendly</button>
        </li>

控制台中没有显示jsPDF方法的错误，因此不确定问题是什么。任何帮助表示赞赏。感谢

Answer 1

我强烈建议您通过此link查看GitHub上的jsPDF - AutoTable库。我最近遇到了一个非常类似的场景，发现在这种情况下维护CSS很困难。这个解决方案非常适合许多用例，并且比单独依赖jsPDF更有效地解决了我的问题。希望这有帮助！

jsPDF - 正确捕获HTML页面为PDF

1 个答案: