Component · v2.7.0

NgbMaskedInputComponent

Fixed masks: 0 = ASCII digit, A = ASCII letter, * = ASCII alphanumeric; backslash escapes literals.

Import

import { NgbMaskedInputComponent } from '@angular-bootstrap/ngbootstrap';

Selector:ngb-masked-input

Declaration

class NgbMaskedInputComponent implements ControlValueAccessor, Validator, OnChanges

Inputs

`inputId`

Native input ID for external label association; generated when omitted.

inputId: string

Default:''

`label`

Visible label associated with the native input.

label: string

Default:''

`ariaLabel`

Accessible name when a visible label is not supplied.

ariaLabel: string

Default:''

`ariaLabelledBy`

Space-separated IDs of accessible naming elements.

ariaLabelledBy: string

Default:''

`ariaDescribedBy`

Space-separated IDs of help or error messages.

ariaDescribedBy: string

Default:''

`mask`

Required fixed mask. Use a backslash to escape a token as a literal.

mask: string

Default:'000-000'

`valueMode`

Raw excludes mask literals; formatted includes them. Default raw.

valueMode: 'raw' | 'formatted'

Default:'raw'

`placeholder`

Optional input hint; does not replace an accessible label.

placeholder: string

Default:''

`inputMode`

Hint for the mobile keyboard; mask validation is independent of this hint.

inputMode: 'text' | 'numeric' | 'tel'

Default:'text'

`required`

Reject an empty value through Angular forms validation.

required: boolean

Default:false

`readOnly`

Keep focus and selection available while preventing edits.

readOnly: boolean

Default:false

`disabled`

Disable editing and remove the native controls from keyboard navigation.

disabled: boolean

Default:false

`value`

Current model value. Supports value/valueChange binding or Angular forms.

get value(): string | null
set value(value: string | null)

Outputs

`valueChange`

Emits normalized partial or complete values; incomplete input remains invalid.

valueChange: EventEmitter<string | null>

Methods

`writeValue`

writeValue(value: string | null): void

`registerOnChange`

registerOnChange(fn: (value: string | null) => void): void

`registerOnTouched`

registerOnTouched(fn: () => void): void

`registerOnValidatorChange`

registerOnValidatorChange(fn: () => void): void

`setDisabledState`

setDisabledState(disabled: boolean): void

`validate`

validate(_control: AbstractControl): ValidationErrors | null

Source: src/inputs/src/masked-input.component.ts in the installed @angular-bootstrap/ngbootstrap package. Angular compiler metadata and private members are omitted.