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

Angular formly only shows blank page when printing form

本文关键字:显示 空白 打印 表单 Angular      更新时间:2023-09-26

我试图创建一个按钮,用户可以打印页面为他们的记录,但它一直显示空白使用形式,我假设因为表单是动态生成的。我在打印按钮中使用打印指令:

    (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>

当我按下按钮时,打印窗口弹出,但除了显示页面名称和日期外,页面是空白的。怎样才能打印出格式字段?

看看angularPrint。