Ng-signature NPM

NgSignature

This library was generated with Angular CLI version 15.1.0.

Installation:

npm i ng-signature

Usage (Blob/Image) Component.html:

<ng-signature (done)="saveImage($event)"></ng-signature>

Component.ts:

saveImage(blob: Blob) {
    // Do something with the blob.
}

app.module.ts:

import { NgSignatureModule } from "ng-signature";

@NgModule({
  declarations: [],
  imports: [NgSignatureModule],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

Options:

Directives	Description	Options	Default
`[editable]`	Turn pad on or off	`true`, `false`	`true`
`[emitOnDragEnd]`	Emit the `(done)` method as soon as drag end.	`true`, `false`	`false`
`[penColor]`	Color of signature pen	Color	`black`
`[backgroundColor]`	Background of signature pad	Color	`transparent`
`(done)`	Fired on clicking `Done` button	`function($event: Blob/base64/json)`	`null`
`(clear)`	Fired on clicking `Clear` button	`function()`	`null`
`[(points)]`	JSON points model	json	`null`
`[format]`	Output format foe `(done)` method. `json` output is same as `points` model.	`blob`, `base64`, `json`	`blob`
`[width]`	Width of canvas	`number`	`600`
`[height]`	Height of canvas	`number`	`150`
`[responsive]`	Resize to 100% parent. But the points will still output `width`x`height` ratio	`true`, `false`	`true`
`[showDoneButton]`	Show or Hide Done Button	`true`, `false`	`true`
`[showClearButton]`	Show or Hide Clear Button	`true`, `false`	`true`
`[doneButtonText]`	Text of Done Button	`string`	`Done`
`[clearButtonText]`	Text of Clear Button	`string`	`Clear`
`[doneButtonClass]`	Class classes of Done Button	`string`	`btn btn-primary`
`[clearButtonClass]`	Class classes of Clear Button	`string`	`btn btn-default`

ng-signature-angular

@ng-plus/signature-pad tslib

@everything-registry/sub-chunk-2275

1 year ago

1 year ago

1 year ago

1 year ago