2

我有一个类型为 number 的输入表单字段,我试图让 Angular 验证(到目前为止这看起来很棒),但是我似乎无法获得正确的语法来动态创建正则表达式以应用于限制 ng-pattern用户可以在 json 调用后传递给控制器​​的最小值和最大值范围内的数字。

这是快速和有用的:

仅用于数字的 ng-pattern 将接受 angular.js 中的“-”之类的字符

所以我最初在 ng-pattern 上设置了它并且它可以工作,但允许在最小和最大范围之外的数字:

$scope.onlyNumbers = /^\d/;

但是,我需要即时制作正则表达式并使其成为一个范围,所以我尝试了但没有取得多大成功:

$scope.onlyNumbers = new RegExp(".{" + $scope.min + "," + $scope.max + "}", "g");

显然,我不是 RegEx 专家。

任何帮助表示赞赏。

提前致谢!

4

1 回答 1

2

尝试使用<input type="number">,然后您可以直接设置最小值和最大值,而无需正则表达式。

html:

<div ng-app ng-controller="FormCtrl">
    <form name="form01">
        <input 
            type="number"
            min="{{range.min}}"
            max="{{range.max}}"
            ng-model="value"
            name="number"
            ng-class="{'error' : !form01.number.$valid}"
        >
    </form>
</div>

js:

function FormCtrl($scope) {
    $scope.range = {
        min: 10,
        max: 20
    };
}

CSS:

.error {
    border: 1px solid red;
    background: rgba(255,0,0,0.3);
}

演示:http: //jsfiddle.net/dmmLgnqb/2/

于 2014-08-15T23:33:56.517 回答