ngx-extended-pdf-viewer 是否可以只呈现一页？答案

【问题标题】：ngx-extended-pdf-viewer Is it possible to render only one page?ngx-extended-pdf-viewer 是否可以只呈现一页？
【发布时间】：2020-02-01 13:54:03
【问题描述】：

我在 Angular 8 中使用 ngx-extended-pdf-viewer，pdf 显示正确。我的问题是我只需要显示一个页面，但默认情况下它会显示所有页面。

有没有办法用这个 pdf 查看器只呈现一个页面？

这是我的代码

<ngx-extended-pdf-viewer 

      [src]="pdfSrc" 
      [handTool]="true"
      [showHandToolButton]="true"
      backgroundColor="#ffffff"
      [height]="'100vh'"
      [useBrowserLocale]="true"
      [zoom]= 73
      [showSidebarButton]="false"
      [showFindButton]="false"
      [showPagingButtons]="false"
      [showZoomButtons]="false"
      [showPresentationModeButton]="false"
      [showOpenFileButton]="false"
      [showPrintButton]="false"
      [showDownloadButton]="false"
      [showBookmarkButton]="false"
      [showSecondaryToolbarButton]="false"
      [showRotateButton]="false"
      [showHandToolButton]="false"
      [showScrollingButton]="false"
      [showSpreadButton]="false"
      [showPropertiesButton]="false"
      [sidebarVisible]="false"

></ngx-extended-pdf-viewer

【问题讨论】：

标签： angular pdf ngx-extended-pdf-viewer

【解决方案1】：

我是 ngx-extended-pdf-viewer 的开发者。不，目前不可能只呈现单个页面。我创建了一个组件，以将优秀的旧 Adobe 阅读器的完整功能集带到 Angular 世界。这是关于以风格阅读整个文档。

要显示单个页面，我推荐另外两种方法：

使用Vadym Yatsyuk 的PDF 小部件。这个人创造了一个令人印象深刻的小部件，所以它可能是你的朋友。但是，它仍然针对显示整个文档进行了优化。
pdf.js 项目页面有examples how to render individual pages。这是一个低级 API，但据我所知，文档很好。

【讨论】：

另请参阅下面的其他答案。他们提到了单页模式。这可能不是您所需要的，但已经很接近了。

【解决方案2】：

你读过the documentation 吗？

[(page)] → 双向绑定属性确定要显示的页面；更准确地说：[page]="25" 使 PDF 查看器显示第 25 页（在任何时间 - 即使在加载时间之后）； [(page)]="attribute" 每次用户滚动到另一个页面时都会更新属性。如果您只对活动感兴趣，那就是(pageChange)。

【讨论】：

[page]="number" 仅将 pdf 查看器居中到页面，我想要的是呈现的 pdf 是我选择的页面，类似于 ng2-pdf-viewer。

【解决方案3】：

如果有人仍然想对上述情况有更好的答案，现在可以通过最近的发展来实现。

我与开发人员一起打开了以下线程，并且能够在最新版本（4.1.0 - 5.0.0）中添加此功能。

https://github.com/stephanrauh/ngx-extended-pdf-viewer/issues/495

请在此处查看 API， https://pdfviewer.net/getting-started 以及单页模式的DEMO https://pdfviewer.net/page-view-mode

【讨论】：

【解决方案4】：

在当前版本中，pageViewMode 可以设置为“single”：

<ngx-extended-pdf-viewer
  [src]="'assets/pdfs/sample.pdf'"
  [pageViewMode]="'single'"
></ngx-extended-pdf-viewer>

这里有记录：

https://www.pdfviewer.net/extended-pdf-viewer/page-view-mode

【讨论】：