【问题标题】:Can not Allow the decimal value inside input field using Angular.js不能使用 Angular.js 允许输入字段内的十进制值
【发布时间】:2016-01-20 17:03:26
【问题描述】:

我需要一个帮助。我有一个输入字段验证,并且这个字段只接受包含十进制值的数字,也使用 Angular.js 模式。我在下面解释我的代码。

<div class="input-group bmargindiv1 col-md-12">
    <span class="input-group-addon ndrftextwidth text-right" style="width:180px">
          Unit Sale Price :
    </span>
    <div ng-class="{ 'myError': billdata.usp.$touched && billdata.usp.$invalid }">
        <input type="text" name="usp" id="usp" class="form-control"
                placeholder="Add Unit Sale Price" 
                ng-model="unit_sale_price" 
                ng-keypress="clearField('usp');" 
                ng-keyup="setLatestSalePrice();" 
                ng-pattern="/^(0|[1-9][0-9]*)$/">
        <div style="clear:both;"></div>
    </div>
</div>
<div class="help-block" ng-messages="billdata.usp.$error"
     ng-if="billdata.usp.$touched || billdata.usp.$error.pattern">
    <p ng-message="pattern" style="color:#F00;">
       This field needs only number(e.g-0,1..9).
     </p>
</div>

这里我的问题是这个字段也不采用小数点值。这里我只需要字符也不允许。请帮助我。

【问题讨论】:

  • 您是否尝试过 type="number" 输入?

标签: javascript angularjs ng-pattern


【解决方案1】:

您可以使用input[type="number"] 处理此问题:

<input type="number" name="usp" id="usp" class="form-control" placeholder="Add Unit Sale Price" ng-model="unit_sale_price" ng-keypress="clearField('usp');" ng-keyup="setLatestSalePrice();">

【讨论】:

    【解决方案2】:

    使用也可以为此使用正则表达式:

    <input type="text" name="usp" id="usp" class="form-control" placeholder="Add Unit Sale Price" ng-model="unit_sale_price" ng-keypress="clearField('usp');" ng-keyup="setLatestSalePrice();" ng-pattern = "^[0-9]+([.][0-9]+)?$">
    

    并使用下面的表达式来表示错误

     ng-show="regForm.password.$error.pattern"
    

    【讨论】:

    • 它也有字符..请检查这个。
    • @satya 我已经更新了正则表达式,试试这个。您可以在 regextester.com 上验证此正则表达式。如果仍然无法修复,请告诉我。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2022-11-29
    • 2020-03-28
    • 1970-01-01
    • 2021-10-22
    • 1970-01-01
    • 2016-03-30
    • 1970-01-01
    相关资源
    最近更新 更多