输入类型编号的 ng-pattern 问题

Question

我在尝试将 ng-pattern 与 input type number.

一起使用时遇到一个奇怪的问题

<input type="number" name="input" min="0" max="1000" data-ng-model="input" ng-pattern="/^[0-9]*$/">
    <div data-ng-if="Form.input.$error.pattern">Please enter an Integer number between 0 and 1000.</div>
</div>

根据我定义的正则表达式，当用户输入 1. 时应该显示错误。对吗？

但是，输入 1. 时不显示错误，但输入 1.1 时显示错误为什么不输入 1.？

我这里有什么遗漏吗？

Answer 1

你的正则表达式非常适合我。

<input type="number" name="input" min="0" max="1000" data-ng-model="input" ng-pattern="/^[0-9]*$/">
    <div data-ng-if="Form.input.$error.pattern">Please enter an Integer number between 0 and 1000.</div>
</div>

这是演示 link：http://plnkr.co/edit/HV2PAPP2gh6cH8KXyYav?p=preview

Answer 2

要允许从 0 到 190（包括 190.0000）的数字，您可以使用 type="text"，然后使用以下正则表达式：

^(?:(?:\d{1,2}|1[0-8]\d)(?:\.\d+)?|190(?:\.0+)?)$

见demo

^ - 字符串锚点的开头（仅匹配字符串开头的其余部分，否则匹配失败）
(?:(?:\d{1,2}|1[0-8]\d)(?:\.\d+)?|190(?:\.0+)?) - 非捕获组 仅用于分组而不记住捕获的文本。它包含 2 个备选方案：
- (?:\d{1,2}|1[0-8]\d)(?:\.\d+)?:
  - (?:\d{1,2}|1[0-8]\d) - 1 或 2 个任意数字 (\d{1,2}) 或 1 后跟 0、1...8，然后是任意一位数字。
  - (?:\.\d+)? - 可选（因为 ? 表示 匹配 1 次或 0 次 ）匹配一个点和 1 个或多个数字。
- 190(?:\.0+)? - 匹配 190，然后可选 . 和 1 个或多个 0 个字符。
$ - 断言字符串结束（如果前面的模式之后还有更多字符，则找不到匹配项）。

在您的案例中，非捕获组可以替换为捕获组，效率和行为没有任何明显的变化。然而，捕获组将它们捕获的文本保存在某个缓冲区中，因此应该更慢（尽管它确实微不足道）。此外，当在模式中使用反向引用时（当你想匹配已经匹配的子字符串时），捕获组是必要的，但这里不是这种情况。

输入类型编号的 ng-pattern 问题

ng-pattern issue with input type number

regex

angularjs

angularjs-ng-pattern