SelectMultipleControlValueAccessor
directive
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 also
NgModules
Selectors
select[multiple][formControlName]select[multiple][formControl]select[multiple][ngModel]
Properties
| Property | Description |
|---|---|
value: any |
The current value |
onChange: (_: any) => { } |
The registered callback function called when a change event occurs on the input element. |
onTouched: () => { } |
The registered callback function called when a blur event occurs on the input element. |
@Input()compareWith: (o1: any, o2: any) => boolean |
Write-only. Tracks the option comparison algorithm for tracking identities when checking for changes. |
Description
Using a multi-select control
The follow example shows you how to use a multi-select control with a reactive form.
const countryControl = new FormControl();<select multiple name="countries" [formControl]="countryControl">
<option *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.
Methods
|
writeValue()
|
|||
|---|---|---|---|
Sets the "value" property on one or of more of the select's options. |
|||
|
value |
any |
The value |
Returns
void
|
registerOnChange()
|
|||
|---|---|---|---|
Registers a function called when the control value changes and writes an array of the selected options. |
|||
|
fn |
(value: any) => any |
The callback function |
Returns
void
|
registerOnTouched()
|
|||
|---|---|---|---|
Registers a function called when the control is touched. |
|||
|
fn |
() => any |
The callback function |
Returns
void
|
setDisabledState()
|
|||
|---|---|---|---|
Sets the "disabled" property on the select input element. |
|||
|
isDisabled |
boolean |
The disabled value |
Returns
void
© 2010–2019 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v7.angular.io/api/forms/SelectMultipleControlValueAccessor