HTML需要验证被Angular忽略吗？

Angular 4忽略了内置的html验证。HTML需要验证被Angular忽略吗？

如何使Angular考虑HTML输入元素的必填字段？

期望behaiviour：

代码：

  <form #loginForm="ngForm" (ngSubmit)="login()" class="m-t" 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 m-b"> 
       <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>

来源

2017-04-26 Sofia Namoun

尝试重大更改列表中列出'NG-required' – Rhea

@Rhea不起作用，同样的问题 –

'ng-required'只在Angularjs中（不在Angular2 +中） –

我也被这个变化咬了。这不是在对角4

您需要添加ngNativeValidate

<form ngNativeValidate #loginForm="ngForm" (ngSubmit)="login()" class="m-t" role="form" action="#">

按本comment

来源

2017-05-18 09:56:53 cortopy

我认为你需要在你的<form>标签中指定novalidate。 Angular已经将验证程序附加到任何包含required属性的ngModel指令的元素。它可能是验证，你只是没有注意到？使用chrome devtools来查看输入是否具有ng-invalid类别？

来源

2017-04-26 09:31:42 Amit

是的，我已经检查过它有ng无效的类，我需要的是内置浏览器验证消息，像这样https：//www.html5rocks .com/static/images/tutorials/constraintvalidation/ChromeForAndroid.png，你觉得novalidate会怎么样帮帮我？ –

哦，你希望两个浏览器消息都出现并且角度维持验证状态吗？删除'novalidate'然后 – Amit

有或没有novalidare，我不能得到想要的行为，（运行内置浏览器验证通常然后执行提交功能） –

HTML需要验证被Angular忽略吗？

回答

相关问题