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>