How to Open PDF file inside dataDirectory

Ionic Framework ionic-v3
1

The scenario was download documents and save to dataDirectory.
After that, the user will be able to view it on the app.

I was trying to use InAppBrowser but only gives me a blank screen
Below is my current code.

openSource(url : string) {
   this.platform.ready().then(() => {
        new InAppBrowser(url, "_blank", 'location=yes,clearcache=no,toolbar=no,closebuttoncaption=Close,hardwareback=no');
    });
}

I also tried to use “_system”, it let me choose what application to use to open the file but after that, it says “Cannot read/open file” .

I tried to test other file types like png and jpg using the above code to check if it does really save on the path I have provided and works fine.I was able to view the image.

I also tried to open a document that gets the file from the internet and it just give me blank view. I guess my code doesn’t really work for documents like Pdf.

Could anyone help me, how can I open/view documents I save on dataDirectory.
Thank you so much guys.

2

Try file opener plugin. But it requires the device to have pdf viewer installed.

3

Helo, yes I have tried this as well. However, I keep on getting a response error that plugin is not installed even though I have a pdf viewer on my device.

See Below Code for reference.

openSource(url : string,filenamme) {

var ext = filenamme.substr(filenamme.lastIndexOf('.') + 1);
var mime = this.appctr.getFileMIME('.'+ext);

    this.platform.ready().then(() => {

        FileOpener.open(url,mime.mim).then((sucesss)=> {
          alert(sucesss);
        }).catch((err)=>{
             alert(err);
        });
    });
}


//code for getting file mime type

  getFileMIME(ext){
    for(let i of this.Mimeobject()){
   
      if(i.id === ext){
        return i;
      }
    }

   
  }

//test mimeobject

  Mimeobject(){
    var mime = [];
    mime=[
          {'id':'.3dm', 'mim': 'x-world/x-3dmf'},
          {'id':'.pdf', 'mim': 'application/pdf'},
          {'id':'.doc', 'mim': 'application/msword'},
          {'id':'.png', 'mim': 'image/png'},
        ]
  
    return mime;
  }
4

My updates on PDF viewer.

Though I haven’t solved to make file opener plugin to work on my current project. I just tried to use the ng2-pdf-viewer instead, and bwalaahhh is a success.

However, my goal is to open different document file whether pdf, xls, docx, png etc. :sweat_smile:
Looking for an available plugin for this, or will still try to make file opener plugin working? (But I am stuck :scream: )

Anyone who have a solution, I would really love to know.
Would appreciate it much.

Thank you in advance guys.