NumericTextBoxComponent

Represents the Kendo UI NumericTextBox component for Angular.

Selector

kendo-numerictextbox

Export Name

Accessible in templates as #kendoNumericTextBoxInstance="kendoNumericTextBox"

Inputs

Name	Type	Default	Description
autoCorrect	boolean		Specifies whether the value will be auto-corrected based on the minimum and maximum values (see example).
changeValueOnScroll	boolean	true	Determines whether the value of the NumericTextBox will be changed via scrolling. Defaults to true.
decimals	number		Specifies the number of decimals that the user can enter when the input is focused (see example).
disabled	boolean		Determines whether the NumericTextBox is disabled (see example). To learn how to disable the component in reactive forms, refer to the article on Forms Support.
fillMode	InputFillMode		The fillMode property specifies the background and border styles of the NumericTextBox (see example). The possible values are: flat solid (default) outline none
inputAttributes	{[key: string]: string}		Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
max	number		Specifies the greatest value that is valid (see example).
maxlength	number		Specifies the maximum number of characters the end user can type or paste in the input. The locale-specific decimal separator and negative sign (-) are included in the length of the value when present. The maxlength restriction is not applied to the length of the formatted value when the component is not focused.
min	number		Specifies the smallest value that is valid (see example).
placeholder	string		Specifies the input placeholder.
rangeValidation	boolean		Determines whether the built-in minimum or maximum validators are enforced when a form is validated. The 4.2.0 Angular version introduces the min and max validation directives. As a result, even if you set rangeValidation to false, the built-in Angular validators will be executed.
readonly	boolean	false	Determines whether the NumericTextBox is in its read-only state (see example).
rounded	InputRounded		The rounded property specifies the border radius of the NumericTextBox (see example). The possible values are: small medium (default) large none
selectOnFocus	boolean		Determines whether the whole value will be selected when the NumericTextBox is clicked. Defaults to true.
size	InputSize		The size property specifies padding of the NumericTextBox internal input element (see example). The possible values are: small medium (default) large none
spinners	boolean		Specifies whether the Up and Down spin buttons will be rendered (see example).
step	number		Specifies the value that is used to increment or decrement the component value (see example).
tabindex	number		Specifies the tabindex of the component.
title	string		Sets the title of the input element of the NumericTextBox.
value	number		Specifies the value of the NumericTextBox (see example).

Fields

Name	Type	Default	Description
format	string | NumberFormatOptions		Specifies the number format which is used when the NumericTextBox is not focused (see example). If format is set to null or undefined, the default format will be used.

Events

Name	Type	Description
inputBlur	EventEmitter<any>	Fires each time the input element gets blurred.
inputFocus	EventEmitter<any>	Fires each time the user focuses the input element.
blur	EventEmitter<any>	Fires each time the NumericTextBox component gets blurred (see example).
focus	EventEmitter<any>	Fires each time the user focuses the NumericTextBox element (see example).
valueChange	EventEmitter<any>	Fires each time the user selects a new value (see example).

Methods

blur
Blurs the NumericTextBox.

focus
Focuses the NumericTextBox. ts @Component({ selector: 'my-app', template: ` <button (click)="numerictextbox.focus()">Focus NumericTextBox</button> <kendo-numerictextbox #numerictextbox></kendo-numerictextbox> ` }) class AppComponent { }

notifyValueChange
Notifies the NumericTextBoxComponent that the input value should be changed. Can be used to update the input after setting the component properties directly.