Sign-pdf NPM | npm.io

An Angular component, that allows to E-signature ( Electronic signature ) add to Pdf and more features.

Demo

Features

Add signature to your Pdf
Line Through Text
Upload Pdf

Download Pdf

Dependencies

Latest version available for 6+ version of angular

Install

npm install sign-pdf --save

Setup

Step 1: Add Module

import { CommonModule } from '@angular/common';

import { SignPdfModule } from 'sign-pdf';

@NgModule({
  imports: [
    CommonModule,
    SignPdfModule, // SignPdfModule added
  ],
  bootstrap: [App],
  declarations: [App],
})
class MainModule {}

Use

Step 2: use by signPdf Tag

<ngx-sign-pdf></ngx-sign-pdf>

Options

There are individual options to customize.

Individual Options

Passed to ngx-sign-pdf

Option	Type	Default	Description
pdfUrl	string	Blank (one blank page pdf url)	it is a base64 encoded string or pdf url.
signatureColors	array	`['aqua', '#1b1bffb3', 'fuchsia', 'gray', 'green', ... ]`	Array of string to assign color to the pen for signature
exportPdf	boolean	false	Show export button in settings
pdfBase64Url	method (function)	none	To get Base64 url of signed Pdf
exportSignatures	boolean		false	Show export Signature button in settings
signaturesList	method (function)	'ease-in'	Take function with event parameter to get list of Base64 url of signature images
pageFix	boolean	true	Allow Scroll to Page or for fix page layout
chooseFileButtonTitle	string	'Choose File'	Assign title to Choose file button in settings
exportPdfButtonTitle	string	'Export Pdf'	Assign title to Export Pdf button in settings
exportSignatureButtonTitle	string	'Export Signatures'	Assign title to Export Signature button in settings
downloadButtonTitle	string	'Download'	Assign title to download button in settings

Example to use Options

<ngx-sign-pdf [pdfUrl]="url" [exportPdf]='exportPdf' [exportSignatures]='exportSignatures' (pdfBase64Url)='getPdfUrl($event)' (signaturesList)='getSignaturesList($event)' [signatureColors]="colorsList" ></ngx-sign-pdf>

and in typescript

  colorsList = ['aqua',  '#1b1bffb3', 'fuchsia', 'gray', 'green', 'greenyellow',
  'lime', '#ad0404b3', '#6464ff', '#caca00','skyblue', 'orange', '#e703e7', '#ff0000a8', 
  'silver', '#01d4d4', 'ghostwhite', 'yellow'];
  exportPdf:boolean = true;
  exportSignatures:boolean = true;
  url = 'http://www.africau.edu/images/default/sample.pdf';

  getPdfUrl(event){
    console.log("Exported pdf url! ",event)
  }

..etc

@insignia