validation - validaciones - validar formulario angular 5

Validación de forma angular 2, el validador minLength no funciona

Question

Tengo la siguiente forma de Angular 2:

<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>

Este es mi componente donde he implementado validadores:

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)])]
        });
    }

}

En este formulario, el campo de email funciona bien para ambos validadores, es decir, cuando no escribo nada, "Email is required" mensaje "Email is required" , cuando comienzo a escribir algo, "Underscore is required" mensaje "Underscore is required" y cuando escribo "_" Todos los mensajes de error desaparecen. Sin embargo, cuando trato de aplicar estos dos validadores en el campo de password , no funciona. Cuando no escribo la contraseña, "Password is required" mensaje como "Password is required" . Pero cuando minLength algo menos de 6 caracteres, el mensaje minLength no aparece en absoluto. ¿Qué está mal en este código?

Answer 1

Esto realmente me llamó la atención cuando hice coincidir la clave de mi marca con lo que tenía en el código, que es incorrecto.

Código de muestra

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

Marcado de muestra

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

Tenga en cuenta que en el código es minlength completamente en minúsculas.

Answer 2

La clave de error es minlength y no minLength :

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