NumericTextBoxComponent
Represents the Kendo UI NumericTextBox component for Angular.
Selector
kendo-numerictextbox
Export Name
Accessible in templates as #kendoNumericTextBoxInstance="kendoNumericTextBox"
Inputs
autoCorrect
boolean
Specifies whether the value will be auto-corrected based on the minimum and maximum values (see example).
changeValueOnScroll
boolean
(default: 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).
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
andmax
validation directives. As a result, even if you setrangeValidation
tofalse
, the built-in Angular validators will be executed.
readonly
boolean
Determines whether the NumericTextBox is in its read-only state (see example).
selectOnFocus
boolean
Determines whether the whole value will be selected when the NumericTextBox is clicked. Defaults to true
.
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).
fillMode
The fillMode property specifies the background and border styles of the NumericTextBox (see example). The possible values are:
flat
solid
(default)outline
none
rounded
The rounded property specifies the border radius of the NumericTextBox (see example). The possible values are:
small
medium
(default)large
none
size
The size property specifies padding of the NumericTextBox internal input element (see example). The possible values are:
small
medium
(default)large
none
Fields
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
blur
EventEmitter<any>
Fires each time the input
element gets blurred (see example).
focus
EventEmitter<any>
Fires each time the user focuses the input
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.
@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.