使用电容器的移动应用程序的 Angular 16 打印机预览

Question

我有使用 Angular 16 和 Capacitor 构建的移动应用程序。我一直在尝试显示移动应用程序的打印预览。

Windows.Print() 的标准方法仅适用于网络和移动网络，但不适用于不显示打印预览的本机 Android 应用程序。我尝试过这个电容器插件：https://www.npmjs.com/package/@bcyesil/capacitor-plugin-printer，它按要求打开打印预览，但按照其文档接受 html 作为字符串例如：

Printer.print({ content: '<h1>Lorem</h1>'})

我尝试使用 Angular 门户将 html 作为字符串从我的组件中获取，该门户适用于 html，但不包含 scss 文件中的 css。有人有类似的经历吗？或者任何帮助将不胜感激。

Answer 1

在这种情况下，您可能需要一个

printWebView(...)

方法。在媒体查询的帮助下，您应该能够控制打印内容（包括您的 Angular 组件）。