Champ de signature Angular | ng-hub-ui-signature
Champ de signature Angular accessible qui stocke les tracés de souris, tactile et stylet comme valeurs SVG évolutives, avec annulation, rétablissement et export PNG.
Référence API
Voici le contrat complet de signature : tout ce que vous pouvez lier, écouter, projeter et personnaliser, réuni au même endroit. Branchez ce dont vous avez besoin et stylisez ce que vous voulez — c’est standalone et compatible avec les signals.
Inputs
Réglez signature à votre goût avec 9 inputs. Liez-les comme n’importe quel @Input Angular.
| Nom | Type | Par défaut | Description |
|---|---|---|---|
label | string | '' | Visible field label. |
formText | string | '' | Helper text shown below the drawing surface. |
height | number | 160 | Logical canvas height in CSS pixels. |
strokeColor | string | 'currentColor' | Colour recorded in new SVG strokes. |
strokeWidth | number | 2 | Base width recorded in new SVG strokes. |
readonly | boolean | false | Prevents drawing while preserving the signature. |
controls | boolean | true | Shows clear, undo and redo actions. |
labels | Partial<HubSignatureLabels> | {} | Overrides the application-wide translated action labels for this field only. |
ariaLabel | string | 'Signature' | Accessible name for the drawing surface. |
Outputs
Réagissez à ce que fait signature — 1 événements sur lesquels accrocher votre logique.
| Nom | Type | Description |
|---|---|---|
valueChange | EventEmitter<string> | Emits the SVG value after a user-originated change. |
Méthodes
Pilotez signature depuis le code — 5 méthodes sur sa surface programmatique.
| Nom | Signature | Retour | Description |
|---|---|---|---|
clear | clear(): void | — | Removes every stroke and emits the empty value. |
undo | undo(): void | — | Removes the most recently committed stroke. |
redo | redo(): void | — | Restores the most recently undone stroke. |
toSvg | toSvg(): string | — | Returns the scalable SVG form value. |
toDataUrl | toDataUrl(type?: string): string | — | Exports the rendered signature, PNG by default. |
Templates
Aucun template documenté pour le moment.