angular-pdf-viewer

WebJar for angular-pdf-viewer

License

License

MIT
Categories

Categories

Angular User Interface Web Frameworks PDF Data
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

angular-pdf-viewer
Last Version

Last Version

0.2.13
Release Date

Release Date

Type

Type

jar
Description

Description

angular-pdf-viewer
WebJar for angular-pdf-viewer
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/winkerVSbecks/angular-pdf-viewer

Download angular-pdf-viewer

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/angular-pdf-viewer/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>angular-pdf-viewer</artifactId>
    <version>0.2.13</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/angular-pdf-viewer/
implementation 'org.webjars.bower:angular-pdf-viewer:0.2.13'
// https://jarcasting.com/artifacts/org.webjars.bower/angular-pdf-viewer/
implementation ("org.webjars.bower:angular-pdf-viewer:0.2.13")
'org.webjars.bower:angular-pdf-viewer:jar:0.2.13'
<dependency org="org.webjars.bower" name="angular-pdf-viewer" rev="0.2.13">
  <artifact name="angular-pdf-viewer" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='angular-pdf-viewer', version='0.2.13')
)
libraryDependencies += "org.webjars.bower" % "angular-pdf-viewer" % "0.2.13"
[org.webjars.bower/angular-pdf-viewer "0.2.13"]

Dependencies

compile (2)

Group / Artifact Type Version
org.webjars.bower : angular jar [1.3.0,2)
org.webjars.bower : pdfjs-dist jar [1.7.351,2)

Project Modules

There are no modules declared in this project.

Angular PDF Viewer

An AngularJS directive to display PDFs. DEMO

Dependencies

  1. AngularJS
  2. PDFJS

Usage

  1. bower install angular-pdf-viewer

  2. Include the path to the lib, AngularJS and PDFJS:

<script src="bower_components/pdfjs-dist/build/pdf.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-pdf-viewer/dist/angular-pdf-viewer.min.js"></script>
  1. Include the lib as a dependency in your angular app:
var app = angular.module('App', ['pdf']);

Directive

The URL, request headers, scale and delegate-handle can be set using the attributes:

<pdf-viewer
    delegate-handle="my-pdf-container"
    url="pdfUrl"
    scale="1"
    show-toolbar="true"
    headers="{ 'x-you-know-whats-awesome': 'EVERYTHING' }"></pdf-viewer>

Delegate Service (pdfDelegate)

The pdfDelegate service allows you to access and control individual instances of a directive. This allows us to have multiple instances of the same directive in the same controller.

Inject the pdfDelegate service into your controller. You can then fetch an instance using it's delegate handle and call methods on it:

pdfDelegate.$getByHandle('my-pdf-container').zoomIn();

The following methods are available to the delegate:

  • prev
  • next
  • zoomIn(amount) default amount = 0.2
  • zoomOut(amount) default amount = 0.2
  • zoomTo(amount)
  • rotate (clockwise by 90 degrees)
  • getPageCount
  • getCurrentPage
  • goToPage(pageNumber)
  • load

Change the PDF File

In order to replace the active PDF with another one, you can call the load method of the delegate. For example:

pdfDelegate
    .$getByHandle('my-pdf-container')
    .load('url-of-the-new-file.pdf');

Example

Run npm install && bower install to install all dependencies. And then gulp dev to start a local server. The example will now be available at localhost:3000/src

Toolbar

The default toolbar can be shown or hidden using the show-toolbar attribute. Since the PDF can be easily controlled using the delegate service it's quite trivial to build a custom toolbar. Or place the toolbar on a separate scope.

Similar projects

  1. angularjs-pdf
  2. ng-pdfviewer

Credit

PDF examples used are Relativity: The Special and General Theory by Albert Einstein as kindly organized and made available free by Project Gutenberg. And the This is Material Design by Google.

Versions

Version
0.2.13
0.2.9