PdfShowcase

Prequisites and announcement

You can get the PDF viewer up and running in roughly two minutes. You need node.js, npm and a current version of Angular. This library aims to be compatible to the last four versions of Angular, which gives you two years time to update.

With very few exceptions, I only maintain the most current version of the viewer. As much as I'd like to provide bug fixes to older versions, I don't have enough time to spare.

Just in case you haven't got an Angular project yet

The instructions below assume you've already got an Angular project. If you haven't, here's what to do:

Install node.js. Make sure it's a current version with an even version number.
Install the Angular CLI by running the command npm i -g @angular/cli.
Create a new Angular app by running the command ng new my-favorite-project.

I've described these steps in more detail here.

Setting up the PDF viewer

Recommended way

Angular CLI

JHipster 6.6 + ngx-extended-pdf-viewer 2.0.0+

older JHipster or Webpack

Still got difficulties?

Complaints and bug reports

Open a terminal and navigate to the root folder of your project.
Run this command and accept the defaults:

ng add ngx-extended-pdf-viewer@latest

If you need a specific version of ngx-extended-pdf-viewer, replace @latest by the version number you need. @latest gets you the newest stable version. If you omit @latest, Angular tries to detect the latest compatible version. Note that this may be an alpha version. Usually these alpha version are useful, too, but they ship without promises. By definition, an alpha version is a version that might be broken.
Add the new component <app-example-pdf-viewer> to your <app-component> to display the PDF file.

After that, you'll probably want to delete the example PDF file and move the code out of the example component.