2017-07-28 8 views
1

こんにちは私はAndroidとiOSの携帯電話に表示するためにイオンページ内にPDFを表示したいと思います。これを行うための最善の方法についてはわからない、私は幸運の誰も助けることができるとhttp://ionicframework.com/docs/native/document-viewer/しようとしている?おかげイオン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(); 
    } 
} 

Iはapp.module.tsに同様プロバイダ内import { DocumentViewer } from '@ionic-native/document-viewer';を添加しました。

これらは私のエラーです:

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'?

答えて

2

から

インポート{DocumentViewerの、DocumentViewerOptions}として、それをインポートしよう'@ ionic-native/document-viewer';

関連する問題