New to Kendo UI for Angular? Start a free 30-day trial

Value Binding

The value of the Signature is a string containing an image encoded as a Data URL.

To set the value, apply any of the following approaches:

  • Use the value property. If the value is set through the value property, you have to hook up to the valueChange event and manually update the value of the value property.
  • Use the [ngModel]({{ site.data.urls.angular['forms'] }}) value binding. If the value is set by the ngModel value binding, the framework will automatically update the corresponding field from the model after the value of the component changes.
  • Use the [formControlName]({{ site.data.urls.angular['formcontrolname'] }}) value binding available in the [Reactive forms]({{ site.data.urls.angular['reactiveforms'] }}). If the value is set by the formControlName value binding, the framework will automatically update the corresponding field from the form model after the value of the component changes.

The Signature does not support the simultaneous usage of the value property and the ngModel value binding.

Export Resolution

The Signature allows you to control the resolution of the exported image using the exportScale property. When set to 1, the exported image will match the element size on screen. We recommend using the default value of 2 or higher to improve the quality on high-resolution screens and print.

The following example demonstrates how to set the export scale.

Example
View Source
Change Theme:

Import Scaling

The Signature scales any images provided as a value to the dimensions of the component. Use images with the same aspect ratio and resolution to avoid distortion.

In this article

Not finding the help you need?