@angular/forms

DefaultValueAccessor

directive

The default ControlValueAccessor for writing a value and listening to changes on input elements. The accessor is used by the FormControlDirective, FormControlName, and NgModel directives.

API

  
    class DefaultValueAccessor extends BaseControlValueAccessor implements ControlValueAccessor {}

writeValue

void

Sets the "value" property on the input element.

@paramvalueany

@returnsvoid

onChange

(_: any) => void

The registered callback function called when a change or input event occurs on the input element.

onTouched

() => void

The registered callback function called when a blur event occurs on the input element.

setProperty

void

Helper method that sets a property on a target element using the current Renderer implementation.

@paramkeystring

@paramvalueany

@returnsvoid

registerOnTouched

void

Registers a function called when the control is touched.

@paramfn() => void

@returnsvoid

registerOnChange

void

Registers a function called when the control value changes.

@paramfn(_: any) => {}

@returnsvoid

setDisabledState

void

Sets the "disabled" property on the range input element.

@paramisDisabledboolean

@returnsvoid

Description

The default ControlValueAccessor for writing a value and listening to changes on input elements. The accessor is used by the FormControlDirective, FormControlName, and NgModel directives.

Exported by

Usage Notes

Using the default value accessor

The following example shows how to use an input element that activates the default value accessor (in this case, a text field).

          const firstNameControl = new FormControl();

          <input type="text" [formControl]="firstNameControl">

This value accessor is used by default for <input type="text"> and <textarea> elements, but you could also use it for custom components that have similar behavior and do not require special processing. In order to attach the default value accessor to a custom element, add the ngDefaultControl attribute as shown below.

          <custom-input-component ngDefaultControl [(ngModel)]="value"></custom-input-component>