Ionic 2在離子頁面中顯示PDF /模式

嗨我想在離子頁面中顯示PDF以顯示在Android和iOS手機上。不知道最好的方法來做到這一點，我試圖http://ionicframework.com/docs/native/document-viewer/沒有運氣，任何人都能夠協助？由於Ionic 2在離子頁面中顯示PDF /模式

home.html的

<button ion-button clear (click)="openModal('assets/pdf/filename.pdf')"> 
    <h2>Link</h2> 
</button> 
<button ion-button clear (click)="openModal('assets/pdf/filename2.pdf')"> 
    <h2>Link 2</h2> 
</button>

home.ts

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { PDFPage } from '../pdfviewer/pdfviewer'; 
import { ModalController } from 'ionic-angular'; 
import { DocumentViewer } from '@ionic-native/document-viewer'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 
    constructor(public navCtrl: NavController,public modalCtrl: ModalController,private document: DocumentViewer) { } 
    const options: DocumentViewerOptions = { 
     title: 'My PDF' 
    } 
    openModal(value) { 
     let myModal = this.modalCtrl.create(PDFPage); 
     myModal.present(); 
     this.document.viewDocument(value, 'application/pdf', options); 
    } 
}

pdfviewer.html

<ion-content padding> 
    <ion-icon large name="close-circle" (click)="closeModal()" float-right style="z-index:9999;font-size:3.5em;padding:20px"></ion-icon> 
</ion-content>

個pdfviewer.ts

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import { ViewController } from 'ionic-angular'; 
import { HomePage } from '../home/home'; 

@Component({ 
    selector: 'page-pdf', 
    templateUrl: 'pdfviewer.html' 
}) 
export class PDFPage { 

    constructor(public navCtrl: NavController,public viewCtrl: ViewController) { } 

    closeModal() { 
     this.viewCtrl.dismiss(); 
    } 
}

我加import { DocumentViewer } from '@ionic-native/document-viewer';到app.module.ts以及在提供者。

這是我的錯誤：

Typescript Error A class member cannot have the 'const' keyword.

Typescript Error Cannot find name 'DocumentViewerOptions'.

Typescript Error Cannot find name 'options'. Did you mean the instance member 'this.options'?

來源

2017-07-28 roshambo

嘗試從導入爲

進口{的DocumentViewer，DocumentViewerOptions} 「@離子天然/文檔查看器」;

來源

2017-09-03 15:21:31

Ionic 2在離子頁面中顯示PDF /模式

回答

相關問題