directive
Synchronizes a standalone FormControl
instance to a form control element.
[formControl]
Property | Description |
---|---|
@Input('formControl')form: FormControl | Tracks the |
@Input('disabled')isDisabled: boolean | Write-Only Triggers a warning in dev mode that this input should not be used with reactive forms. |
@Input('ngModel')model: any | Deprecated as of v6 |
@Output('ngModelChange')update: EventEmitter | Deprecated as of v6 |
override | Sets the new value for the view model and emits an |
path: string[] | Read-Only |
control: FormControl | Read-Only |
NgControl
AbstractControlDirective
abstract control: AbstractControl | null
value: any
valid: boolean | null
invalid: boolean | null
pending: boolean | null
disabled: boolean | null
enabled: boolean | null
errors: ValidationErrors | null
pristine: boolean | null
dirty: boolean | null
touched: boolean | null
status: string | null
untouched: boolean | null
statusChanges: Observable<any> | null
valueChanges: Observable<any> | null
path: string[] | null
validator: ValidatorFn | null
asyncValidator: AsyncValidatorFn | null
Identifier | Usage |
---|---|
ngForm | #myTemplateVar="ngForm" |
Note that support for using the ngModel
input property and ngModelChange
event with reactive form directives was deprecated in Angular v6 and is scheduled for removal in a future version of Angular. For details, see Deprecated features.
The following example shows how to register a standalone control and set its value.
import {Component} from '@angular/core'; import {FormControl, Validators} from '@angular/forms'; @Component({ selector: 'example-app', template: ` <input [formControl]="control"> <p>Value: {{ control.value }}</p> <p>Validation status: {{ control.status }}</p> <button (click)="setValue()">Set value</button> `, }) export class SimpleFormControl { control: FormControl = new FormControl('value', Validators.minLength(2)); setValue() { this.control.setValue('new value'); } }
viewToModelUpdate() | |||
---|---|---|---|
|
newValue | any |
void
NgControl
AbstractControlDirective
© 2010–2021 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v12.angular.io/api/forms/FormControlDirective