angolare convalida 2 forma, minLength validatore non funziona

Question

Ho seguito angolare 2 forma:

<register> 
    <form [ngFormModel] = "registrationForm"> 
     <div class = "form-group"> 
      <label class = "control-label" for="email">Email</label> 
      <input class = "form-control" type="email" id="email" ngControl="email" #email="ngForm"> 
     </div> 
     <div *ngIf = "email.touched && email.errors"> 
      <div *ngIf = "!email.errors.required && email.errors.underscoreNotFound" class = "alert alert-danger"> 
       <span>Underscore is required</span> 
      </div> 
      <div *ngIf = "email.errors.required" class = "alert alert-danger"> 
       <span>Email is required</span> 
      </div> 
     </div> 
     <div class = "form-group"> 
      <label class = "control-label" for="password">Password</label> 
      <input class = "form-control" type="password" id="password" ngControl="password" #password="ngForm"> 
     </div> 
     <div *ngIf = "password.touched && password.errors"> 
      <div *ngIf = "password.errors.minLength && !password.errors.required" class = "alert alert-danger"> 
       <span>Password should contain 6 characters</span> 
      </div> 
      <div *ngIf = "password.errors.required" class = "alert alert-danger"> 
       <span>Password is required</span> 
      </div>   
     </div> 
    </form> 
</register> 

questo è il mio componente in cui ho implementato validatori:

import {Component} from '@angular/core'; 
import {Control, ControlGroup, FormBuilder, Validators} from '@angular/common'; 
import {CustomValidator} from './CustomValidator'; 

@Component({ 
    selector: 'register', 
    templateUrl: './app/authentication/register_validation/register.html', 
}) 

export class RegisterComponent{ 
    registrationForm: ControlGroup; 

    constructor(formBuilder:FormBuilder) 
    { 
     this.registrationForm = formBuilder.group({ 
      email: ['',Validators.compose([Validators.required, CustomValidator.underscore])], 
      password: ['',Validators.compose([Validators.required,Validators.minLength(6)])] 
     }); 
    } 

} 

In questa forma, email campo sta funzionando bene per entrambi i validatori, cioè quando non scrivo nulla, dà il messaggio "Email is required", quando inizio a digitare qualcosa, dà il messaggio "Underscore is required" e quando digito lo "_" tutti i messaggi di errore scompaiono. Tuttavia, quando provo ad applicare questi 2 validatori sul campo password, non funziona. Quando non digito la password, viene visualizzato il messaggio "Password is required". Ma quando digito qualcosa di meno di 6 caratteri, il messaggio minLength non viene visualizzato affatto. Cosa c'è di sbagliato in questo codice?

Answer 1

Il error key is minlength e non minLength:

<div *ngIf = "password.hasError('minlength') && !password.hasError('required')" class = "alert alert-danger"> 
    <span>Password should contain 6 characters</span> 
</div> 

Answer 2

Questo mi ha davvero catturato fuori così come ho abbinato la chiave nella mia markup per quello che avevo in codice che non è corretto.

codice di esempio

password1: ['', [Validators.required, Validators.minLength(8)]],

Esempio Markup

*ngIf="registrationRequest.get('password1').hasError('minlength')"

Nota nel codice è minlength interamente in minuscolo.