在 Ionic 中打印多个二维码 Angular

Question

我在 Ionic 中有一个网页使用 qr-code 生成二维码。这些代码来自 NodeJS 端点，我相应地在 Ionic 应用程序的前端生成代码。到目前为止，我可以轻松生成二维码并单独打印它们。

HTML

<div class="ion-text-center">              
    <div id="div_codes">
        <canvas *ngFor="let c of codes" [attr.id]="'div_' + c.code"></canvas>
            <div>
                  <ion-button (click)="print(c.code)">
                    <ion-icon name="print"></ion-icon>
                  </ion-button>
            </div>
    </div>

使用dom-to-image

打印很简单

print(code: string) {
    var node = document.getElementById(`div_${code}`);
    domtoimage.toPng(node)
      .then(function (dataUrl) {
        var popup = window.open();
        popup.document.write('<img src=' + dataUrl + '>');
        popup.document.close();
        popup.focus();
        popup.print();
        popup.close();
      })
      .catch(function (error) {
        console.error('oops, something went wrong!', error);
      });
  }

从我的 NodeJs 端点，我可以获得多达 10,000 个启用分页的代码。这样就解决了。

我想打印端点的所有二维码，不管分页。我可以有哪些选择？像 printAll 按钮会从端点获取所有代码并将它们发送到打印机。

Answer 1

最后，我找到了解决办法。我没有从前端（angular 应用程序）打印 10,000 次，而是设法从后端（nodejs）完成。在 Nodejs 中，我将所有 QR 码转换为流（缓冲区），然后将该缓冲区添加到 excel sheet (exceljs) 中。所以我可以将所有这些代码放在一个 excel sheet 中，然后我打印 excel sheet.

在 Ionic 中打印多个二维码 Angular

Printing multiple QR codes in Ionic Angular

angular

ionic-framework

qr-code

dom-to-image