How to check whether a form or a control is untouched or not in Angular 10 ?
Last Updated :
24 May, 2021
In this article, we are going to check whether a form is untouched or not in Angular 10. untouched property is used to report that the control or the form is valid or not.
Syntax:
form.untouched
Return Value:
- boolean: the boolean value to check whether a form is untouched or not.
NgModule: Module used by the untouched property is:
Approach:
- Create the Angular app to be used.
- In app.component.html make a form using ngForm directive.
- In app.component.ts get the information using untouched property.
- Serve the angular app using ng serve to see the output.
Example 1:
app.component.ts
import { Component } from '@angular/core' ;
import { FormGroup, FormControl, FormArray, Validators }
from '@angular/forms'
@Component({
selector: 'app-root' ,
templateUrl: './app.component.html' ,
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
form = new FormGroup({
name: new FormControl(
),
rollno: new FormControl()
});
get name(): any {
return this .form.get( 'name' );
}
onSubmit(): void {
console.log( "Form is untouched : " , this .form.untouched);
}
}
|
app.component.html
< br >
< form [formGroup]="form" (ngSubmit)="onSubmit()">
< input formControlName = "name" placeholder = "Name" >
< br >
< button type = 'submit' >Submit</ button >
< br >
< br >
</ form >
|
Output:
Reference: https://angular.io/api/forms/AbstractControlDirective#untouched
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...