Today, We want to share with you angular form valid.In this post we will show you angular form invalid but no errors, hear for angular reactive form validation we will give you demo and example for implement.In this post, we will learn about Angular 6 Form Validation with Message – Angular 6 Live Validation with an example.

How to Check Form is Valid or not in Angular?

here you can learn all about how to check form is valid or invalid in angular 6, angular 7, angular 8, angular 9, angular 10 and angular 11 online single web application.

Submit
Submit

Import FormsModule:

src/app/app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
  
import { AppComponent } from './app.component';
  
@NgModule({
  imports:      [ BrowserModule, FormsModule, ReactiveFormsModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

Template Code:

src/app/app.component.html

    
How to check form is valid or not in Angular - www.pakainfo.com
       
    

           
        

            Name
            
        
        
        

            Email
            
        
  
        Result:
        
{{ form.valid }}
        Submit

    

updated Ts File
src/app/app.component.ts 
import { Component } from '@angular/core';
import { FormGroup, FormControl, Validators} from '@angular/forms';
  
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  
   form = new FormGroup({
    name: new FormControl('', [Validators.required, Validators.minLength(3)]),
    email: new FormControl('', [Validators.required, Validators.email])
  });
    
  submit(){
    console.log(this.form.valid);
  
    if(this.form.valid){
      console.log(this.form.value);
    }
  }
}

ng serve

Results 
true

{name: "virat", email: "[email protected]"}

I hope you get an idea about angular form validators.

I would like to have feedback on my infinityknow.com blog.

Your valuable feedback, question, or comments about this article are always welcome.

If you enjoyed and liked this post, don’t forget to share.


 
Related posts:

Form Text Box with Angular Material(mat-input) Example