Angular：如何使用默认输入需要验证答案

【问题标题】：Angular: How To Use Default Input Required ValidationAngular：如何使用默认输入需要验证
【发布时间】：2022-10-13 15:59:50
【问题描述】：

所以我只想使用来自 HTML 的默认 required 验证。

这是我的代码：

<form (ngSubmit)="submit()">
  <div class="login-container">
    <ion-item>
      <ion-input
        required
        type="email"
        [(ngModel)]="vm.email"
        placeholder="Email"
        name="Email"
      ></ion-input>
    </ion-item>
    <ion-item>
      <ion-input
        required
        type="password"
        [(ngModel)]="vm.password"
        placeholder="Password"
        name="Password"
      ></ion-input>
    </ion-item>

    <div class="ion-text-center">
      <ion-button expand="full" class="button-round" type="submit"
        >Login</ion-button
      >
    </div>
  </div>

如果我单击提交按钮，它将转到submit() 函数。在 React 中，如果输入无效，默认情况下，它将阻止对 submit() 函数的操作，并提示一条错误消息，指出 This field is required（或类似的东西）。我怎样才能在 Angular 中做到这一点？我已经搜索了解决方案，显然，他们建议进行自定义验证（这很麻烦）。我只是想让它变得简单。我的验证只有required。

【问题讨论】：

在 Angular 中，您需要使用响应式表单来实现这一点。

标签： angular

【解决方案1】：

基本上默认情况下，angular 会添加一些叫做 novalidate 的东西。如果你们想使用浏览器的原生表单验证，只需添加 ngNativeValidate 属性：

【讨论】：

<form ngNativeValidate></form>