使用PDFJS和angular 7进行打印预览

PDFJS是一个用于在Web浏览器中显示PDF文件的开源JavaScript库。它提供了一种无需使用插件或其他额外软件即可在网页上展示PDF文件的方式。

Angular 7是一个流行的前端开发框架，它基于TypeScript构建，并提供了一套丰富的工具和组件，用于开发现代化的Web应用程序。

使用PDFJS和Angular 7进行打印预览的步骤如下：

首先，确保已经安装了Angular CLI，并创建了一个新的Angular项目。
在项目中安装PDFJS库。可以通过npm包管理器运行以下命令来安装：

npm install pdfjs-dist

在Angular组件中引入PDFJS库。可以在组件的TypeScript文件中添加以下代码：

import * as pdfjs from 'pdfjs-dist';

创建一个用于展示PDF文件的HTML元素。可以在组件的HTML模板中添加以下代码：

<div id="pdfContainer"></div>

在组件的TypeScript文件中编写加载和展示PDF文件的逻辑。可以使用以下代码：

ngOnInit() {
  const pdfUrl = 'path/to/pdf/file.pdf';
  const container = document.getElementById('pdfContainer');

  pdfjs.getDocument(pdfUrl).promise.then(pdf => {
    for (let i = 1; i <= pdf.numPages; i++) {
      pdf.getPage(i).then(page => {
        const canvas = document.createElement('canvas');
        container.appendChild(canvas);

        const context = canvas.getContext('2d');
        const viewport = page.getViewport({ scale: 1 });

        canvas.width = viewport.width;
        canvas.height = viewport.height;

        page.render({
          canvasContext: context,
          viewport: viewport
        });
      });
    }
  });
}