文章/答案/技术大牛

发布

问如何使用ng-pattern
EN

Stack Overflow用户

提问于 2015-02-20 09:46:56

回答 2查看 17.1K关注 0票数 5

我有一个简单的文本输入，其中只允许使用浮点数和整数(注意: jade)

input.form-control(type="text", ng-model='usd', ng-pattern="nums",ng-change='convert_to_btc()', placeholder="USD")

但是它不起作用，我总是可以在输入中插入任何字符(我是否需要做更多操作才能显示某些内容？例如，如果不正确，会出现红色边框？或者应该只输入那些字符，甚至不能输入？)模式是正则表达式，因此不是字符串，所以应该没问题？

下面是控制器：

app.controller("AppCtrl", function AppCtrl($scope, $http, $interval ) {
    //lots of other stuff
    $scope.nums = /^\-?\d+((\.|\,)\d+)?$/; //note no string, it's a  regex
}

这是生成的HTML。这会是问题所在吗？生成的HTML实际上有一个字符串，而不是正则表达式！？

<input type="text" ng-model="usd" ng-pattern="/^\-?\d+((\.|\,)\d+)?$/" ng-change="convert_to_btc()" placeholder="USD" class="form-control ng-dirty ng-valid-parse ng-touched ng-invalid ng-invalid-pattern">

regex

angularjs

pug

ng-pattern

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-02-20 11:56:59

我希望这就是你想要做的。

请看下面的链接

http://plnkr.co/edit/BGzLbQHy0ZtHYmom8xA3

<!DOCTYPE html>
<html ng-app="">

<head>
 <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.13/angular.js" data-semver="1.3.13">      
 </script>
  <style>
    .ng-invalid-pattern {
      border:1px solid #f00;
    }
  </style>
</head>

<body>
  <p>Hello</p>

  <form name='myform'>      
    <input type="text" name='ip' ng-model="usd" ng-pattern="/^\-?\d+((\.|\,)\d+)?$/" 
  ng-change="convert_to_btc()" placeholder="USD"/>
    <p ng-show='myform.ip.$invalid'>Error</p>
  </form>


  </body>

</html>

票数 4

Stack Overflow用户

发布于 2016-02-25 05:32:48

如果您试图阻止用户输入字符/字母，而只允许他们在输入中输入数字，则将<input type="text"更改为<input type="number"

这里有一个指向Angular Doc页面的链接，该页面的输入应该只允许数字：input[number]

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/28620378

复制

相似问题

问如何使用ng-pattern
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用ng-patternEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用ng-pattern
EN