在按键上标记为 ng-valid 的必填字段，即使它是空的

Question

我正在使用 Angular 2，并且在表单验证方面遇到了一个相当基本的问题。一个应该是数字的必填文本字段在第一个 keydown 事件之后被标记为有效，无论我输入的值是什么，我无法猜测为什么。

这是控件（我使用的是 Jade 模板）：

input.form-control(required, type='number', [(ngModel)]='details.averageAnnualVisitorCount', placeholder='Example: 5000000')

最初，控件按预期标记为 ng-pristine 和 ng-invalid：

<input class="form-control ng-untouched ng-pristine ng-invalid" placeholder="Example: 5000000" required="required" type="number">

但是当我专注于该字段并按任意键（甚至是无效键）时，控件被标记为有效，我不知道为什么。比如我试了Z，因为使用type='number'而被拒绝，但是字段还是标记为ng-valid，如下图：

<input class="form-control ng-dirty ng-valid ng-touched" placeholder="Example: 5000000" required="required" type="number">

这不应该是 ng-ditry ng-invalid 和 ng-touched 吗？我还尝试添加 ngControl，认为我缺少一些与 ngControl 类相关的行为，但这也没有改变行为。

Answer 1

这是数字和选择字段的已知问题

• https://github.com/angular/angular/issues/8048
• https://github.com/angular/angular/issues/6527 看起来这将在下一个测试版中修复

Answer 2

我在尝试对我的论坛进行颜色编码以显示验证时遇到了这个问题。我用ng-pattern 修复它。也许尝试一下？我知道有一个简单的 reg 表达式可以用来检测数字。 Check out here 获取 reg 表达式帮助。