Wie validieren Sie ein E-Mail-Feld in angular 2 mit modellgesteuerten Formular

Question

Wie validieren Sie ein E-Mail-Feld in eckigen 2 mit modellgesteuerten Formular, das ist, was ich bisher habe.

Dies ist meine Form Komponente

export class signinComponent { 
    signinform: FormGroup; 
    constructor(public fb: FormBuilder) { 
     this.signinform = this.fb.group({ 
      name: ['', Validators.required], 
      email: ['', Validators.required] 
     }); 
    } 
} 

Dies ist meine Form html

<form class="ui form" [formGroup]="signinform" novalidate> 
    <div> 
     <input type="email" class="emailinput" [formControl]="signinform.controls['email']" placeholder="Email Address"> 
    </div> 
</form 

Answer 1

Validationsmethode:

authEmailValidation(control: FormControl): {[s:string]:boolean} { 
     let pattern = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 

     if (!pattern.test(control.value)) { 
      return { email: true }; 
     } 
     return null; 
    } 

In Ihrer Komponente:

this.signinform = this.fbuilder.group({ 
        email : ["", [this.authEmailValidation]], 
        // Other fields.... 
       }); 

Hinweis: dnt in Konstruktor vergessen:

private signinform : FormGroup; 
private fbuilder: FormBuilder 
// and import them