DocumentViewer无法使用Ionic 3

Hou*_*dri 8 javascript android cordova ionic-framework

我试着在这里使用ionic/cordova插件.

所以我把这段代码放在我的页面中:

  showDocument() {
    var options: DocumentViewerOptions = {
      title: 'A book',
      documentView: { closeLabel: '' },
      navigationView: { closeLabel: '' },
      email: { enabled: true },
      print: { enabled: true },
      openWith: { enabled: true },
      bookmarks: { enabled: true },
      search: { enabled: false },
      autoClose: { onPause: false }
    }
    this.docViewer.viewDocument('assets/arabic.pdf', 'application/pdf', options);
  }
Run Code Online (Sandbox Code Playgroud)

还有一个简单的按钮可以在html页面中启动它:

<ion-content>
  <button  ion-button round (click)="showDocument()">
    Read
  </button>
</ion-content>
Run Code Online (Sandbox Code Playgroud)

但我在模拟器中看不到任何内容(因为无法在浏览器上运行它)

离子信息在那里:

在此输入图像描述

更新:

这是我使用我的设备和chrome devtools进行调试时得到的结果:

在此输入图像描述

更新2:

我试图使用绝对路径,但我有空值,我做了这些更改:

import { File } from '@ionic-native/file';
declare let cordova: any;
//staff

pdfSrc: string = cordova.file.applicationDirectory + 'assets/arabic.pdf';

//staff
console.log(this.pdfSrc);
this.document.viewDocument(this.pdfSrc, 'application/pdf', options)
Run Code Online (Sandbox Code Playgroud)

但看看我得到了什么:

在此输入图像描述

Uni*_*nic 1

这并不能直接回答您的问题,而是显示 PDF 的一种解决方法。

我在使用很多用于阅读 PDF 的插件时遇到了麻烦,因此我最终只使用了一个名为PDF.js的 Mozilla 项目来直接在 Android 平台上的浏览器中呈现 PDF,而在 iOS 上,它们会在浏览器中本地显示。为了像查看器一样处理它,与应用程序的其余部分分开,我使用了应用程序内浏览器窗口

这里有一些 PDF.js 的代码示例: http://mozilla.github.io/pdf.js/examples/index.html#interactive-examples

希望对某人有帮助!