Preview/Read a .pdf file inside Nativescript application


Hey Everyone!

Possible Ways to provide the preview/read option for .pdf files inside the Nativescript applications :face_with_monocle:

Looking ways for NS flavors :

  • NativeScript Core applications

  • NativeScript with Angular applications

Looking Possible Ways :

  • Load file from FileSystem/external storage

  • Load file from URL

  • Load file from device’s local database

Suggest your ideas here!


Show pdf in view
How to view .pdf file inside a folder in app using file system

Take a look at this plugin for viewing PDFs:


Thanks @roblauer, I have implemented the nativescript-pdf-view plugin with my project by this morning.

Here i have shared some code, It may help someone!

Nativescript with Angular

Preview from Local storage using FileSystem

Here I am having one separate modal page for managing all previews.


    <StackLayout *ngIf="pdfpreview" rows="auto, *, auto, auto, auto">
        <Label width="50%" row="0" text="Report Type : Certs" color="black"></Label>
        <FlexboxLayout height="85%" row="1" flexDirection="column">
            <pdf:PDFView flexGrow="1" src="{{ pdfpath }}"></pdf:PDFView>
        <Label row="2" text="Comments" color="black"></Label>
        <TextView row="3" editable="false"></TextView>
        <Button row="4" width="30%" class="btn btn-primary btn-rounded-sm" text="Close" (tap)="submit()"></Button>


       case "pdf":
                // fetch filename from controller using app settings
                filename = this.attachedfilename;

                var afile: File;
                var afolder: Folder;
                var afoldername: string;
                var afilename: string;

                //fetch path
                afoldername = fs.path.join(documents.path, "Pdf Details", filename);
                console.log("pdf folder path : " + afoldername);

                //set the pdf
                this.pdfpath = afoldername;

                //set the scope
                this.pdfpreview = true;


Hi! I saw this topic and it seems quite interesting, though I’m using Vanilla JS

how does preview.ts convert to js?



Apart (perhaps) from the this, that code is just plain js. Oh, and you probably have to remove the : type stuff from the variables.


Thanks for the reply, I tried it but it wouldn’t work
I’ve opened a topic stating something similar as this.

How to view .pdf file inside a folder in app using file system


Hi @kumaran,

Thanks for the code. Is this working in iOS? Did you check?