javascript - 输入类型 ="number"包含 null 而不是字符

Question

我有一个 number 输入字段，我想用 Angular2 验证它:

<input type="number" class="form-control" name="foo" id="foo"
       [min]="0" [max]="42" [(ngModel)]="foo" formControlName="foo">

到目前为止这在 Chrome 中工作正常，因为 Chrome 忽略字符作为输入(不将它们插入输入 -> 输入为空 -> 需要验证触发器，或者已经有一个数字所以最小/最大验证触发器).

问题

另一方面，Firefox 让用户在输入中输入字符，这就是问题所在，如果我插入字符，则所需的验证会触发，并且表单控件的值评估为 null，这结果是:

问题

我想区分空值和无效模式，但我发现实现此目的的唯一方法是制作 input type="text" 并使用模式验证器，因为输入为 null(如果它包含字符)并且模式验证器不会在 input type="number" 上触发。

• 有没有办法使用 Angular2 FormGroup 对象访问字段的实际值(甚至 document.querySelector('#foo').value尽管输入包含 42bar)?

，但计算结果为 null

• 或者有没有办法检查输入字段是否包含字符？

• 或者除了使用 input type="text" 没有其他方法吗？

Answer 1

如果您在“数字”输入中输入的内容不是数字，则该值将为 null。这就是它应该的工作方式。

您可以检查 .validity.valid 标志以查看该字段是否具有有效值；空值被认为对数字字段有效。