javascript - AngularJS 到 pdfMake 类型错误 : Cannot read property 'ownerDocument' of null at html2canvas

Question

当我单击导出按钮时会发生这种情况

  $scope.export = function() {
        html2canvas(document.getElementById('balanceSheet')).then(function(canvas) {
            document.body.appendChild(canvas);
            var data = canvas.toDataURL();
            var docDefinition = {
                content: [{
                    image: data,
                    width: 500,
                }]
            };
            pdfMake.createPdf(docDefinition).download("test.pdf");
        });
    }

我导入的脚本是:

• pdfmake.min.js
• html2canvas.js

完整的错误消息在这里:

angular.js:14328 TypeError: Cannot read property 'ownerDocument' of null
    at html2canvas (html2canvas.js:3364)
    at b.$scope.export (ReportsController.js:29)
    at fn (eval at compile (angular.js:15156), <anonymous>:4:144)
    at e (angular.js:26744)
    at b.$eval (angular.js:17972)
    at b.$apply (angular.js:18072)
    at HTMLAnchorElement.<anonymous> (angular.js:26749)
    at HTMLAnchorElement.dispatch (jquery-1.11.2.min.js:3)
    at HTMLAnchorElement.r.handle (jquery-1.11.2.min.js:3)

有什么想法为什么它不起作用吗？任何帮助将不胜感激!

编辑:

<div class="col s12" ng-if="balanceSheet" id="balanceSheet">
                    <div class="row left-align"><i ng-click="returnToMain()"  class="mdi-hardware-keyboard-backspace medium"></i></div>
                    <div class="row center-align">
                        <p><h3>{{businessData.companyName}}</h3></p>
                        <p><h5>Balance Sheet</h5></p>
                        <p><h5>As of date here</h5></p>
                        <div class="divider"></div>
                    </div>
                    <div class="row center-align">
                        <div class="col s6 m6 l6">
                            <div class="row"><h5>Assets</h5></div>
                            <div class="row">
                                <div class="col s12">
                                    <div class="col s6">
                                        <p>Cash</p>
                                    </div>
                                    <div class="col s6">
                                        <p>Php 120</p>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>

编辑2:

html2canvas.js:373 Invalid value given for Length: "auto"

:8080/#!/Reports:1 Uncaught (in promise) invalid image, images dictionary should contain dataURL entries (or local file paths in node.js)

Answer 1

这是因为 ng-if 的功能尝试将 ng-if="balance Sheet" 替换为 ng-show ="balance Sheet" 它应该可以工作。