Angular 4 ignora la validación html incorporada.
¿Cómo hacer que Angular considere el campo requerido html para los elementos de entrada?
Comportamiento deseado:
código:
<form #loginForm="ngForm" (ngSubmit)="login()" class="mt" role="form" action="#"> <div class="form-group"> <input type="text" [(ngModel)]="username" name="username" class="form-control" [placeholder]="'Nom d\'utilisateur' | translate" required /> </div> <div class="form-group"> <input type="password" [(ngModel)]="password" name="password" class="form-control" [placeholder]="'Mot de passe' | translate" required> </div> <button type="submit" data-spinner-color="white" data-style="zoom-in" [ladda]="isLoading" translate class="btn btn-primary block full-width mb"> <span translate >Login</span> </button> <a [routerLink]="['/reset' , '1']"><small translate>Mot de passe oublié ?</small></a> <br><br> <p class="text-muted text-center"> <small translate>vous n'êtes pas encore enregistré ?</small> </p> <a translate id="register" class="btn btn-sm btn-white btn-block" [routerLink]="['/register']"> Créer un compte </a> </form>A mí también me mordió este cambio. No figura en la lista de cambios importantes en angular 4.
Necesita agregar ngNativeValidate
<form ngNativeValidate #loginForm="ngForm" (ngSubmit)="login()" class="mt" role="form" action="#">según este comentario
Creo que debe especificar novalidate en su etiqueta <form> . Angular ya adjunta un validador a cualquier elemento con una directiva ngModel que incluye un atributo required . ¿Podría estar validando y simplemente no te das cuenta? ¿Utiliza Chrome DevTools para ver si las entradas tienen la clase ng-invalid ?