Angular pdf.js 预览和打印
Angular pdf.js preview and print
我正在 AngularJs 开发一个应用程序,它必须向用户显示服务器生成的 pdf。
使用 pdf.js 我成功下载并显示了一个 pdf,问题是现在我必须向用户提供打印它的功能。
我看到两种方式:
- 单击按钮后,打开一个新的 window 并重新下载 pdf 以显示打印预览。但这会使服务器超载;
- 使用 angular 在某处下载 pdf,并让 pdf.js 只渲染它,然后仅使用本地文件使用以前的方法进行打印。但是我不知道文件保存在哪里
我遗漏了一些东西,还有其他方法吗?
谢谢。
看看 PDF.js 演示应用程序 - 它包含一个打印按钮!
有一个 npm 包可以做到这一点 https://github.com/legalthings/angular-pdfjs-viewer
用法
<!DOCTYPE html>
<html ng-app="app" ng-controller="AppCtrl">
<head>
<title>Angular PDF.js demo</title>
<script src="bower_components/pdf.js-viewer/pdf.js"></script>
<link rel="stylesheet" href="bower_components/pdf.js-viewer/viewer.css">
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-pdfjs-viewer/dist/angular-pdfjs-viewer.js"></script>
<script src="app.js"></script>
<style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
.some-pdf-container { width: 100%; height: 100%; }
</style>
</head>
<body>
<div class="some-pdf-container">
<pdfjs-viewer src="{{ pdf.src }}"></pdfjs-viewer>
</div>
</body>
</html>
我正在 AngularJs 开发一个应用程序,它必须向用户显示服务器生成的 pdf。
使用 pdf.js 我成功下载并显示了一个 pdf,问题是现在我必须向用户提供打印它的功能。
我看到两种方式:
- 单击按钮后,打开一个新的 window 并重新下载 pdf 以显示打印预览。但这会使服务器超载;
- 使用 angular 在某处下载 pdf,并让 pdf.js 只渲染它,然后仅使用本地文件使用以前的方法进行打印。但是我不知道文件保存在哪里
我遗漏了一些东西,还有其他方法吗?
谢谢。
看看 PDF.js 演示应用程序 - 它包含一个打印按钮!
有一个 npm 包可以做到这一点 https://github.com/legalthings/angular-pdfjs-viewer
用法
<!DOCTYPE html>
<html ng-app="app" ng-controller="AppCtrl">
<head>
<title>Angular PDF.js demo</title>
<script src="bower_components/pdf.js-viewer/pdf.js"></script>
<link rel="stylesheet" href="bower_components/pdf.js-viewer/viewer.css">
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-pdfjs-viewer/dist/angular-pdfjs-viewer.js"></script>
<script src="app.js"></script>
<style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
.some-pdf-container { width: 100%; height: 100%; }
</style>
</head>
<body>
<div class="some-pdf-container">
<pdfjs-viewer src="{{ pdf.src }}"></pdfjs-viewer>
</div>
</body>
</html>