How to use PDF.js in Angular 2/4/5?

Question

I'm trying to develop PDfViewer Application using Mozilla's PDF.js (example here). It would be great if there is any github project as a reference.

Thanks inadvance!!

Answer 1

If it is not a must to use Mozilla's PDF.js then you can use ng2-pdf-viewer npm module which uses PDF.js in background. You can start of it with following steps

Install

npm install ng2-pdf-viewer --save

Note: For angular 4 or less use version 3.0.8

Then, import the module in app.module.js

import { PdfViewerModule } from 'ng2-pdf-viewer';

@NgModule({
  imports: [BrowserModule, PdfViewerModule],
  declarations: [AppComponent],
  bootstrap: [AppComponent]
})

And then use it in your component

@Component({
  selector: 'example-app',
  template: `
  <pdf-viewer [src]="pdfSrc" 
              [render-text]="true"
              style="display: block;">
  </pdf-viewer>
})

For more details, refer the below git URL and the demo URL.

https://github.com/VadimDez/ng2-pdf-viewer

https://vadimdez.github.io/ng2-pdf-viewer/

Hope this helps you.