File

packages/eui/packages/components/eui-select/eui-select-multiple.directive.ts

Description

The ControlValueAccessor for writing multi-select control values and listening to multi-select control changes. The value accessor is used by the FormControlDirective, FormControlName, and NgModel directives.

See EuiSelectControlValueAccessor

Using a multi-select control

The follow example shows you how to use a multi-select control with a reactive form.

Example :
const countryControl = new FormControl();
Example :
<select euiSelect multiple name="countries" [formControl]="countryControl">
  <option euiOption *ngFor="let country of countries" [ngValue]="country">
    {{ country.name }}
  </option>
</select>

Customizing option selection

To customize the default option comparison algorithm, <select> supports compareWith input. See the SelectControlValueAccessor for usage.

Extends

SelectMultipleControlValueAccessor

Implements

ControlValueAccessor DoCheck

Metadata

Index

Properties
Methods
Inputs
Accessors

Constructor

constructor()

Inputs

isInvalid
Type : boolean

Methods

_getOptionId
_getOptionId(value: any)
Parameters :
Name Type Optional
value any No
Returns : string | null
_getOptionValue
_getOptionValue(valueString: string)
Parameters :
Name Type Optional
valueString string No
Returns : any
_registerOption
_registerOption(value: EuiSelectMultipleOption)
Parameters :
Name Type Optional
value EuiSelectMultipleOption No
Returns : string
registerOnChange
registerOnChange(fn: (value: any) => void)

Registers a function called when the control value changes and writes an array of the selected options.

Parameters :
Name Type Optional
fn function No
Returns : void
registerOnTouched
registerOnTouched(fn: any)
Parameters :
Name Type Optional
fn any No
Returns : void
writeValue
writeValue(value: any)

Sets the "value" property on one or of more of the select's options.

Parameters :
Name Type Optional
value any No
Returns : void

Properties

_idCounter
Type : number
Default value : 0
_optionMap
Type : Map<string | EuiSelectMultipleOption>
Default value : new Map<string, EuiSelectMultipleOption>()
value
Type : any

The current value.

Accessors

isInvalid
getisInvalid()
setisInvalid(state: BooleanInput)
Parameters :
Name Type Optional
state BooleanInput No
Returns : void

results matching ""

    No results matching ""