Angular 仅在打印表单时显示空白页

Question

我正在尝试创建一个按钮，用户可以在其中打印页面以供记录，但使用 formly 时它一直显示为空白，我假设是因为表单是动态生成的。我在“打印”按钮中使用了打印指令：

    (function (angular) {
    'use strict';
    function printDirective() {
        var printSection = document.getElementById('printSection');
        // if there is no printing section, create one
        if (!printSection) {
            printSection = document.createElement('div');
            printSection.id = 'printSection';
            document.body.appendChild(printSection);
        }
        function link(scope, element, attrs) {
            element.on('click', function () {
                var elemToPrint = document.getElementById(attrs.printElementId);
                if (elemToPrint) {
                    printElement(elemToPrint);
                }
            });
            window.onafterprint = function () {
                // clean the print section before adding new content
                printSection.innerHTML = '';
            }
        }
        function printElement(elem) {
            // clones the element you want to print
            var domClone = elem.cloneNode(true);
            printSection.appendChild(domClone);
            window.print();
        }
        return {
            link: link,
            restrict: 'A'
        };
    }
    angular.module('formlyApp').directive('ngPrint', [printDirective]);
}(window.angular));

这里是打印按钮：

<button class="btn btnSubmit" type="submit" ng-print  print-element-id="printSection" ng-hide="vm.iForm.$invalid">Print and Save</button>

当我按下按钮时会弹出打印窗口，但是除了显示页面名称和日期之外，页面是空白的。我怎样才能得到正式的字段来打印出来？

Answer 1

看看angularPrint。它让一切变得超级简单。