输入类型=＆＃34;数字＆＃34;包含null而不是字符

Question

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

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

到目前为止，这在Chrome中运行良好，因为Chrome会忽略字符作为输入（不会将它们插入到输入中 - ＆gt;输入为空 - ＆gt;必需的验证触发器，或者已经有一个数字所以最小值/ max validation triggers）。

问题

另一方面，Firefox允许用户输入字符到输入中，这就是问题，如果我插入字符，那么所需的验证触发器和表单控件的值评估为null，这导致了：

问题

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

• 有没有办法使用Angular2 FormGroup对象访问字段的实际值（即使document.querySelector('#foo').value评估为null，尽管输入包含42bar ）？

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

• 或者除了使用input type="text"之外别无他法吗？

Answer 1

如果您输入的数字不是数字的“数字”输入，则值为null。这就是它的工作方式。

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