Angular: How To Use Default Input Required Validation-CodePudding

So I just want to use the default required validation from HTML.

This is my code:

<form (ngSubmit)="submit()">
  <div >
    <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 >
      <ion-button expand="full"  type="submit"
        >Login</ion-button
      >
    </div>
  </div>

If I click the submit button, it will go to the submit() function. In React, if the inputs are not valid, by default, it will prevent the action to the submit() function and also prompt an error message saying This field is required (or something like that). How can I do it in Angular? I have searched for the solution, and apparently, they are suggesting doing custom validation (which is a hassle). I just want to make it simple. My validation is only required.

CodePudding user response：

Basically by default angular is adding something called novalidate. If you guys want to use browser's native form validation just add ngNativeValidate attribute: