Creating PDF Docs in Ionic using pdfMake.org

demo
21

Hey guys, i got solution for this using cordova pdf - genrator its realy easy plugin and helpful for me ,
Thanks @dbertels for your co- operation .

22

@roshandhabekar Trying cordova pdf-generator here is the basic code I was hoping to build on and I get a blank page

Any ideas

constructor(public navCtrl: NavController, public navParams: NavParams, private dataService:Data) {

    const before = Date.now();

    document.addEventListener('deviceready', () => {
      console.log('DEVICE READY FIRED AFTER', (Date.now() - before), 'ms');

      cordova.plugins.pdf.htmlToPDF({
          data: "<html> <h1>  Hello World  </h1> </html>",
          documentSize: "A4",
          landscape: "portrait",
          type: "base64"
        },
        (sucess) => console.log('sucess: ', sucess),
        (error) => console.log('error:', error));
    });


  }
1 Like
23

Hallo, try it this way:

  • install it:
    npm install pdfmake --save

  • import stuff

import pdfFonts from 'pdfmake/build/vfs_fonts.js';
import pdfMake from 'pdfmake/build/pdfmake';
pdfMake.vfs = pdfFonts.pdfMake.vfs; // FIX font reference

ā€¦

  • use it
foraTemer() {
    var dd = {
    	content: [
    		'First paragraph',
    		'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'
    	]
    }

    console.log("gerandddoooo");
    var pdf = pdfMake.createPdf(dd);

    pdf.getBase64(function (output) {
       console.log(output)
    });
  }

\o/

24

@dimascrocco dimascrocco
Have you tested your code on android device ?

25

I tested only on android device.

26

How is that ? you convert the file to base64. and after that what did you do

27

you can save the PDF to a file and then show it to the user.

beware when opening a PDF in android, you need to copy or move the PDF file to
cordova.file.externalApplicationStorageDirectory, otherwise you will face permission issues.

28

@dimascrocco

What about IOS ?

location to store the file.

29

@dimascrocco Iā€™ve just used pdfmake plugin in my application as you mentioned, iā€™m generating pdf successfully.
But the issue is when i use this plugin, my app startup time is increased by 6-7 seconds. I tried even adding pdfmake plugin in ionic blank application, it also takes 6-7 seconds to load app.
Please visit below issue:

Please help me out of this issue asap. Thanks in advance.

30

Sorry for the late responseā€¦
The pdfmake library has 955K (minified version), if you do not lazy load it, your boot will need an extra time to load all this code.