Angular 签名字段 | ng-hub-ui-signature

可访问的 Angular 签名字段,将鼠标、触摸和手写笔输入保存为可缩放 SVG 表单值,并支持撤销、重做和 PNG 导出。

API 参考

这里是 signature 的完整契约:你可以绑定、监听、投影和设置主题的一切,都集中在一处。接入你需要的部分,自定义你想要的样式——它是 standalone 的,且对 signal 友好。

输入

通过 9 个输入项精细调校 signature。像绑定任意 Angular @Input 一样绑定它们。

名称类型默认值描述
labelstring''Visible field label.
formTextstring''Helper text shown below the drawing surface.
heightnumber160Logical canvas height in CSS pixels.
strokeColorstring'currentColor'Colour recorded in new SVG strokes.
strokeWidthnumber2Base width recorded in new SVG strokes.
readonlybooleanfalsePrevents drawing while preserving the signature.
controlsbooleantrueShows clear, undo and redo actions.
labelsPartial<HubSignatureLabels>{}Overrides the application-wide translated action labels for this field only.
ariaLabelstring'Signature'Accessible name for the drawing surface.

输出

响应 signature 的行为——有 1 个事件可供你挂接逻辑。

名称类型描述
valueChangeEventEmitter<string>Emits the SVG value after a user-originated change.

方法

通过代码驱动 signature——其编程接口提供 5 个方法。

名称签名返回值描述
clearclear(): voidRemoves every stroke and emits the empty value.
undoundo(): voidRemoves the most recently committed stroke.
redoredo(): voidRestores the most recently undone stroke.
toSvgtoSvg(): stringReturns the scalable SVG form value.
toDataUrltoDataUrl(type?: string): stringExports the rendered signature, PNG by default.

模板

尚未记录任何模板。