Question

由于某种原因，我的“必需”和“最小长度”属性似乎不起作用。（ngSubmit）=“ onLogin（）”始终通过。我在这里想念什么？

<form *ngIf="activeTab === 'password'" class="login-form" (ngSubmit)="onLogin()">

          <div class="form-group">
            <label for="email">Email</label>
            <div class="input-group mb-3">
              <div class="input-group-prepend">
                <span class="input-group-text">
                  <i class="fas fa-user"></i>
                </span>
              </div>
              <input required type="email" class="form-control input-with-icon" [(ngModel)]="loginModel.email" id="email" name="email">
            </div>
          </div>

          <div class="form-group">
            <label for="password" >Parool</label>
            <div class="input-group mb-3">
              <div class="input-group-prepend">
                <span class="input-group-text">
                  <i class="fas fa-key"></i>
                </span>
              </div>
              <input required minlength="8" type="password" class="form-control input-with-icon" [(ngModel)]="loginModel.password" id="password" name="password">
            </div>
          </div>

          <div class="row col-12 justify-content-center login-btn-container">
            <input type="submit" value="Sisene" class="btn btn-primary login-btn">
          </div>
        </form>

Answer 1

它正在工作，您只是在误解应该如何进行验证。在您的ngSubmit函数中，您应该检查表单的有效性：

<form #f="ngForm" (ngSubmit)="onLogin(f.value, f.valid)" novalidate></form>

onLogin(value, isValid) {

  if (isValid) {
    // Send to backend
  }
}

角形式验证什么都不做

1 个答案: