angularpdf.js

How to import PDFjs-dist in angular project in order to know to view-port of the pdf file


I would like to use pdfjs-dist package in angular project. How to import it angular project

I installed it using

npm install --save pdfjs-dist

But don't know how to import into a particular component and work with it


Solution

  • After installing it, in package.json something look like this

     "dependencies": {
        ...
        "pdfjs-dist": "^2.2.228",
        ...
        }
    

    1) Now in component you could be able to import it like

    import * as pdfjsLib from 'pdfjs-dist';
    

    2) Now you could use it like bellow example

    yourMethodName() {
        pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';
        const loadingTask = pdfjsLib.getDocument('https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/examples/learning/helloworld.pdf');
        loadingTask.promise.then(function(pdf) {
        console.log(pdf);
        });
    }