NgModel class

Creates a form NgControl instance from a domain model and binds it to a form control element. The form NgControl instance tracks the value, user interaction, and validation status of the control and keeps the view synced with the model.

This directive is intended to be used as a stand-alone value. If you would like to use it as part of a larger form, then it must be assigned a name using `ngControl="name". See NgControlName directive for more details.

All you need is the ngModel selector to activate it. For a two-way binding, use the [(ngModel)] syntax to ensure the model updates in both directions.

Learn more about ngModel in the Forms and Template Syntax pages.

Examples

<input [(ngModel)]="currentHero.name">

This is equivalent to having separate bindings:

<input
  [ngModel]="currentHero.name"
  (ngModelChange)="currentHero.name=$event">

Try the live example.

Inheritance
Annotations
  • @Directive(selector: '[ngModel]:not([ngControl]):not([ngFormControl])', providers: [ExistingProvider(NgControl, NgModel)], exportAs: 'ngForm', visibility: Visibility.all)

Constructors

NgModel(@Optional() @Self() @Inject(NG_VALIDATORS) List? validators, @Optional() @Self() @Inject(ngValueAccessor) List<ControlValueAccessor>? valueAccessors)

Properties

control Control
no setteroverride
dirty bool?
no setterinherited
disabled bool
getter/setter pairoverride-getter
enabled bool?
no setterinherited
errors Map<String, dynamic>?
no setterinherited
hashCode int
The hash code for this object.
no setterinherited
model ← dynamic
no getter
name String?
getter/setter pairinherited
path List<String>
no setteroverride
pristine bool?
no setterinherited
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
touched bool?
no setterinherited
untouched bool?
no setterinherited
update Stream
Updates from the view itself.
no setteroverride
valid bool?
no setterinherited
validator ValidatorFn?
finalinherited
value → dynamic
no setterinherited
valueAccessor ControlValueAccessor?
getter/setter pairinherited
viewModel ↔ dynamic
getter/setter pair

Methods

ngAfterChanges() → void
ngOnInit() → void
Executed after the first change detection run for a directive.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
reset({dynamic value}) → void
Resets the form control.
inherited
toggleDisabled(bool isDisabled) → void
inherited
toString() String
A string representation of this object.
inherited
viewToModelUpdate(dynamic newValue) → void
override

Operators

operator ==(Object other) bool
The equality operator.
inherited