html - 代码块使用 PdfMake 破坏 pdf

Question

设想 ：

• 在 AngularJS 中使用 pdfMake 创建 pdf
• 它工作正常，除了这个代码块，当它包含在标记为 pdf 创建的 div 中时，会产生一个空白的 pdf。

这是有问题的块：

<div ng-repeat="thumb in responseArray" ng-if="responseArray.length >= 1">
        <p>_____________________________________</p>
        <p>Supplier ID: {{thumb.supplier_id}}</p>  
        <p>Supplier Name: {{thumb.supplier_name}}</p> 
        <p>Staked: {{thumb.staked}}</p>
        <p>Returns: {{thumb.returns}}</p>
        <p>Gross: {{thumb.gross}}</p>
        <p>Details: {{thumb.chargeDetailsSummary}}</p>        
        <p>Total Charge: {{thumb.charge}}</p>   
    </div>  

我生成pdf的代码如下：

 s.export = function(){
        html2canvas(document.getElementById('exportThis'), {
            onrendered: function (canvas) {
                var data = canvas.toDataURL();
                var docDefinition = {
                    content: [{
                        image: data,
                        width: 500,
                    }]
                };
                pdfMake.createPdf(docDefinition).download("test.pdf");
            }
        });
    }

任何了解 pdfMake 的人都对为什么以及如何解决有任何建议吗？

对所有建议开放，请提出建议。
谢谢你。

标签： htmlangularjspdf-generationpdfmake

Answer 1

像这样固定：

<p ng-repeat="thumb in responseArray">
                 Supplier Id: {{thumb.supplier_id}}
                 Supplier Name:{{thumb.supplier_name}}
                 Staked: {{thumb.staked}}
                 Returns: {{thumb.returns}}
                 Gross: {{thumb.gross}}
                 Details: {{thumb.chargeDetailsSummary}}
                 Total Charge: {{thumb.charge}}
            </p>

猜猜这只是 div 标签的问题。