How to check whether a form or a control is valid or not in Angular 10 ?
Last Updated :
03 Jun, 2021
In this article, we are going to check whether a form is touched or not in Angular 10. The valid property is used to report that the control or the form is valid or not.
Syntax:
form.valid
Return Value:
- boolean: the boolean value to check whether a form is valid or not.
NgModule: Module used by the valid 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 the valid property.
- Serve the angular app using ng serve to see the output.
Example:
Javascript
import { Component } from '@angular/core' ;
import { FormGroup, FormControl,
FormArray, Validators } from '@angular/forms'
@Component({
selector: 'app-root' ,
templateUrl: './app.component.html'
})
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 valid : " , this .form.valid);
}
}
|
app.component.html
< 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#valid
Share your thoughts in the comments
Please Login to comment...