如何验证带有加减值角js的文本框

Question

我需要在文本框中输入加减值。我用角度js做了下面的验证。但是当用户输入零时，用户可以在没有正负符号的情况下输入它。在我的解决方案中，用户不能输入没有正负符号的零。如何允许类型为零而不加或减符号。

<input name="temperature" type="text" class="form-control" ng-maxlength="3"
 ng-model="eletctyDetail.temperatureValue" ng-required="true" 
 ng-pattern="/^[-+]\d+(\.\d+)?$/" ng-pattern-err-type="tempPattern" />

Answer 1

您的模式-- /^[-+]\d+(\.\d+)?$/ --在起始位置匹配-或+。然后，\d+匹配任意一个或多个数字。

现在，您只需要匹配一个0或+/-，后面跟着从1到9范围的任何数字。这就是您需要使用替换的地方：(0|[-+][1-9])。

整个regex看起来就像

ng-pattern="/^(0|[+-][1-9])\d*(\.\d+)?$/"

见regex演示。

如果您需要使- / +可选使用

ng-pattern="/^(0|[+-]?[1-9])\d*(\.\d+)?$/"
                     ^

模式细节

• ^ -字符串的开始
• (0|[+-][1-9]) -- 0或+/-后面跟着一个从1到9范围的数字(因此，-或+仅在1-9前面是必需的)(注意:如果使用[-+]?，正负将成为可选的，因为?匹配1或0)
• \d*(\.\d+)? - 0+数字(请注意，模式中的+变为*，因为第一个数字已经与交替组一起使用)，然后是一个. +1或更多数字的可选序列。
• $ -字符串的末端。

Answer 2

这个怎么样？

<input name="temperature" type="text" class="form-control" ng-maxlength="3"
 ng-model="eletctyDetail.temperatureValue" ng-required="true" 
 ng-pattern="^[-+]?[0-9]*\.?[0-9]+$" ng-pattern-err-type="tempPattern" />

检查一下这把小提琴