I am trying to use the document-viewer to read the pdf files in the assets folder in a new ionic 4 project but I run into error

Uncaught TypeError: Object(...) is not a function at index.js:139 at Module../node_modules/@ionic-native/document-viewer/index.js (index.js:190) at webpack_require (bootstrap:83) at Module../src/app/app.module.ts (app.component.ts:11) at webpack_require (bootstrap:83) at Module../src/main.ts (main.ts:1) at webpack_require (bootstrap:83) at Object.0 (main.ts:12) at webpack_require (bootstrap:83) at checkDeferredModules (bootstrap:45)

contents.page.ts

import { ActivatedRoute } from '@angular/router';
import { Component, OnInit } from '@angular/core';
import { Location } from '@angular/common';
import { DocumentViewer, DocumentViewerOptions } from '@ionic-native/document-viewer';
declare var require: any;
const novels = require('../../../assets/Json/novels.json');

@Component({
  selector: 'app-contents',
  templateUrl: './contents.page.html',
  styleUrls: ['./contents.page.scss']
})

export class ContentsPage implements OnInit {
  source: string;
  bookId: any;
  slide: any;


  options: DocumentViewerOptions = {
    title: 'My PDF'
  }
  constructor(private _location: Location,private activatedRoute: ActivatedRoute,private document: DocumentViewer) {}
  goBack() {
    console.log('back');
    this._location.back();
  }
  ngOnInit() {
    this.slide = novels;
    this.bookId = this.activatedRoute.snapshot.paramMap.get('bookid');

    this.slide.forEach(obj => {
    if (obj.idNumber === this.bookId) { 
    this.document.viewDocument(this.source, 'application/pdf', this.options)
}
    });


  }


}

contents.page.html

<ion-header>
    <ion-toolbar color="success">
        <ion-icon class="iconSize" slot="start" (click)="goBack()" name="arrow-back"></ion-icon>
        <ion-title>Contents</ion-title>
        <ion-icon class="iconSize" slot="end" [routerLink]="['/home']" name="home"></ion-icon>
      </ion-toolbar>
</ion-header>

<ion-content>


</ion-content>

0 Answers