API for input

API reference for Angular Material input

import {MatInputModule} from '@angular/material/input';

Selector: input[matInput] textarea[matInput] select[matNativeControl] input[matNativeControl] textarea[matNativeControl]

Exported as: matInput
Properties
Name Description
@Input({ transform: booleanAttribute })

disabledInteractive: boolean

Whether the input should remain interactive when it is disabled.

@Input()

errorStateMatcher: ErrorStateMatcher

An object used to control when error messages are shown.

@Input()

readonly: boolean

Whether the element is readonly.

@Input()

type: string

Input type of the element.

errorState: boolean

Whether the input is in an error state.

ngControl: inject(NgControl, { optional: true, self: true })!

Methods
focus

Focuses the input.

Parameters

options?

FocusOptions

updateErrorState

Refreshes the error state of the input.

Object that can be used to configure the default options for the input.

Properties
Name Description

disabledInteractive: boolean

Whether disabled inputs should be interactive.

Injection token that can be used to provide the default options for the input.

const MAT_INPUT_CONFIG: InjectionToken<MatInputConfig>;

This token is used to inject the object whose value should be set into MatInput. If none is provided, the native HTMLInputElement is used. Directives like MatDatepickerInput can provide themselves for this token, in order to make MatInput delegate the getting and setting of the value to them.

const MAT_INPUT_VALUE_ACCESSOR: InjectionToken<{ value: any; }>;

API reference for Angular Material input-testing

import {MatInputHarness} from '@angular/material/input/testing';

Harness for interacting with a standard Material inputs in tests.

Properties
Name Description

static hostSelector: '[matInput], input[matNativeControl], textarea[matNativeControl]'

Methods
async
blur

Blurs the input and returns a promise that indicates when the action is complete.

Returns
Promise<void>

Promise that resolves when the action completes.

async
focus

Focuses the input and returns a promise that indicates when the action is complete.

Returns
Promise<void>

Promise that resolves when the action completes.

async
getId

Gets the id of the input.

Returns
Promise<string>

async
getName

Gets the name of the input.

Returns
Promise<string>

async
getPlaceholder

Gets the placeholder of the input.

Returns
Promise<string>

async
getType

Gets the type of the input. Returns "textarea" if the input is a textarea.

Returns
Promise<string>

async
getValue

Gets the value of the input.

Returns
Promise<string>

async
host

Gets a Promise for the TestElement representing the host element of the component.

Returns
Promise<TestElement>

async
isDisabled

Whether the input is disabled.

Returns
Promise<boolean>

async
isFocused

Whether the input is focused.

Returns
Promise<boolean>

async
isReadonly

Whether the input is readonly.

Returns
Promise<boolean>

async
isRequired

Whether the input is required.

Returns
Promise<boolean>

async
setValue

Sets the value of the input. The value will be set by simulating keypresses that correspond to the given value.

Parameters

newValue

string

Returns
Promise<void>

Promise that resolves when the action completes.

static
with

Gets a HarnessPredicate that can be used to search for a MatInputHarness that meets certain criteria.

Parameters

options

InputHarnessFilters = {}

Options for filtering which input instances are considered a match.

Returns
HarnessPredicate<MatInputHarness>

a HarnessPredicate configured with the given options.

Harness for interacting with a native select in tests.

Properties
Name Description

static hostSelector: 'select[matNativeControl]'

Methods
async
blur

Blurs the select and returns a void promise that indicates when the action is complete.

Returns
Promise<void>

Promise that resolves when the action completes.

async
focus

Focuses the select and returns a void promise that indicates when the action is complete.

Returns
Promise<void>

Promise that resolves when the action completes.

async
getId

Gets the id of the select.

Returns
Promise<string>

async
getName

Gets the name of the select.

Returns
Promise<string>

async
getOptions

Gets the options inside the select panel.

Parameters

filter

NativeOptionHarnessFilters = {}

Returns
Promise<MatNativeOptionHarness[]>

async
host

Gets a Promise for the TestElement representing the host element of the component.

Returns
Promise<TestElement>

async
isDisabled

Gets a boolean promise indicating if the select is disabled.

Returns
Promise<boolean>

async
isFocused

Whether the select is focused.

Returns
Promise<boolean>

async
isMultiple

Gets a boolean promise indicating if the select is in multi-selection mode.

Returns
Promise<boolean>

async
isRequired

Gets a boolean promise indicating if the select is required.

Returns
Promise<boolean>

async
selectOptions

Selects the options that match the passed-in filter. If the select is in multi-selection mode all options will be clicked, otherwise the harness will pick the first matching option.

Parameters

filter

NativeOptionHarnessFilters = {}

Returns
Promise<void>

Promise that resolves when the action completes.

static
with

Gets a HarnessPredicate that can be used to search for a MatNativeSelectHarness that meets certain criteria.

Parameters

options

NativeSelectHarnessFilters = {}

Options for filtering which select instances are considered a match.

Returns
HarnessPredicate<MatNativeSelectHarness>

a HarnessPredicate configured with the given options.

Harness for interacting with a native option in tests.

Properties
Name Description

static hostSelector: 'select[matNativeControl] option'

Selector used to locate option instances.

Methods
async
getIndex

Index of the option within the native select element.

Returns
Promise<number>

async
getText

Gets the option's label text.

Returns
Promise<string>

async
host

Gets a Promise for the TestElement representing the host element of the component.

Returns
Promise<TestElement>

async
isDisabled

Gets whether the option is disabled.

Returns
Promise<boolean>

async
isSelected

Gets whether the option is selected.

Returns
Promise<boolean>

static
with

Gets a HarnessPredicate that can be used to search for a MatNativeOptionHarness that meets certain criteria.

Parameters

options

NativeOptionHarnessFilters = {}

Options for filtering which option instances are considered a match.

A set of criteria that can be used to filter a list of MatInputHarness instances.

Properties
Name Description

placeholder: string | RegExp

Filters based on the placeholder text of the input.

value: string | RegExp

Filters based on the value of the input.

A set of criteria that can be used to filter a list of MatNativeSelectHarness instances.

A set of criteria that can be used to filter a list of MatNativeOptionHarness instances.

Properties
Name Description

index: number

isSelected: boolean

text: string | RegExp

Azure & Blue theme selected.