Question

我有一个输入文本框，其中只允许输入数字.numbers =＆＃34;仅限数字＆＃34;是阻止用户输入任何内容而不是数字的指令。现在我不应该允许用户输入值大于4.Plz的数字。 HTML：

<input type='text' name='pat' id='pat' ng-model='dpmArr.pt_no'  class='form-control' numbers-only="numbers-only">

Answer 1

有2个属性可让您为输入添加最小值和最大值min和max

所以只需在标记中添加max ="4"

即可

Answer 2

使用带有type="number"和max=4属性的输入：

<input type="number" max="4" name="input" ng-model="example.value">

参考。 https://docs.angularjs.org/api/ng/input/input%5Bnumber%5D

Answer 3

您自己的指令

你可以添加另一个这样的指令：

html中的

：

<input with-max-limit max-limit="9" type="text" ng-required="true"  name="search" ng-model="value">

在您的js：

中

.directive("withMaxLimit", function () {
        return {
            require: ["ngModel"],
            restrict: "A",
            link: function ($scope, $element, $attrs) {
                var modelName = $attrs.ngModel;
                var maxLimit = parseInt($attrs.maxLimit, 10);
                $scope.$watch(modelName, function (newValue, oldValue) {
                    if (newValue && (newValue.length > maxLimit || newValue.indexOf(' ') >= 0)) {
                        $scope[modelName] = oldValue;
                    }
                });
            }
        }
    })

考虑到它是草稿版本，您可以轻松修改它。

同时注意 Angular的命名约定该指令的名称为withMaxLimit，但在html中它将为with-max-limit。

AngularJS过滤器

另请参阅Angular的limitTo filter。

Answer 4

你如何应用这些数字的行为？我问，因为也许你可以尝试遵循相同的模式。否则，我认为根据您的需求有多个选项。例如，如果用户引入一个大于4的数字，那么预期的行为应该是什么？返回错误，阻止并且不在输入中写入任何内容，...

根据它，您可以选择将$parsers添加到ngModelController，或者只是通过检查已按下的键来阻止键的默认行为。

如何限制用户不要输入大于4的数字？

4 个答案:

您自己的指令

AngularJS过滤器