“ min”验证规则在使用Angular2“ ngForm.valid”时不适用

Question

我正在使用Angular 8表单模块进行表单验证。我的问题是，“最小”验证规则不适用于验证。这是我的示例表格：

html：

<form #form="ngForm" (ngSubmit)="form.valid && submit()">
  <input type="number" min="5" required name="count" [(ngModel)]="count">
  <button>submit</button>
  <br><br>
  Submitted value is : {{submittedValue || "Nothing yet..."}}
</form>

TS：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {

  count = -5;
  submittedValue :number;

  submit(){
    console.log(this.count);
    this.submittedValue = this.count;
  }
}

您可以在此处测试运行代码：https://angular-html-validation-test.stackblitz.io

Answer 1

目前，模板驱动的表单不支持最小，最大角度验证。您需要为模板驱动实现自定义验证器，或为响应式表单。

您可以查看此-https://www.concretepage.com/angular-2/angular-4-min-max-validation，它可以帮助您为模板驱动的表单使用自定义验证器。

也请查看此答案。 How to use min, max validation in template form angular 2