Needless UI

Composants

Champ numérique

Un champ de saisie de nombres avec boutons d’incrément, formaté selon la langue et la région.

Import

import-number-field.ts
import { NuiNumberField, NuiNumberInput, NuiNumberStep } from '@needless-ui/angular/number-field';

NuiNumberField

Regroupe le champ et ses boutons d’incrément.

Sélecteur
[nuiNumberField]

NuiNumberInput

Un champ de texte qui contient un nombre, sous forme de spinbutton ARIA.

Sélecteur
input[nuiNumberInput]
NomTypePar défautDescription
valueBidirectionnelnumber | nullnullLe nombre, ou null si le champ est vide. Fonctionne aussi avec les formulaires.
minInputnumberValeur minimale autorisée.
maxInputnumberValeur maximale autorisée.
stepInputnumber1De combien un pas modifie la valeur. À la perte du focus, la valeur s’aligne dessus.
formatInputIntl.NumberFormatOptions{}Options Intl.NumberFormat, par exemple { style: 'currency', currency: 'EUR' }.
localeInputstringLOCALE_IDParamètres régionaux utilisés pour formater et lire les nombres.
disabledInputbooleanfalseDésactive le champ et ses boutons.
stepByMéthode(count: number) => voidAvance (positif) ou recule (négatif) d’un certain nombre de pas.

NuiNumberStep

Un bouton d’incrément. Le maintenir enfoncé répète l’action.

Sélecteur
button[nuiNumberStep]
NomTypePar défautDescription
nuiNumberStepInputnumber1 augmente d’un pas et -1 diminue d’un pas.
labelInputstringNom accessible. Par défaut, « Increase » ou « Decrease ».