html5 number类型，仅接受正整数

Question

我使用的是一个带有html5数字类型输入的angular应用程序。我试图将输入限制为只接受正整数，而不接受小数、浮点数。

我尝试使用一些模式和step=1最小、最大值，但似乎不起作用。

请提个建议。

编辑：

这就是我的表单的样子。如果我可能有原因的话，很抱歉给你带来了混乱。

<div class="row bottom-spaced-small">
        <div class="col-md-3">
            Number*
        </div>
        <div class="col-md-9">
            <input name="txtNumber" ng-disabled="somevalue" min="1" step="1" type="number" ng-required="true" ng-maxlength="50" ng-model="someNumber" class="form-control color-black" />
        </div>
        <div class="row" style="padding-left: 30px" ng-if="someForm.$submitted && !someForm.txtNumber.$valid">
            <span style="color: red">Number is mandatory and must be a non 0 positive number.</span>
        </div>
    </div>

Answer 1

虽然要检查support，但可以设置min属性；

<input type="number" min="0" step="1">

Answer 2

<input type="number" step="1" min="0">

type是输入字段的类型，step定义了允许的数字的步长，即只允许整数，最后将min设置为零意味着不允许使用负数。因此，只允许正整数(整数)和零。

Answer 3

好的伙计们，

谢谢你贴出了一些有效的答案，但我的要求是另一回事。因此，我决定编写我自己的指令来解决这个问题。

'use strict';

(function () { var app = angular.module("common")；

var onlyInteger = function () {
    return {
        restrict: "A",
        require: '?ngModel',
        link: function (scope, element, attrs, ctrl) {
            ctrl.$parsers.push(function (inputValue) {
                if (inputValue == undefined) return '';
                var transformedValue = inputValue.replace(/[^0-9]/g, '');                    
                if (transformedValue !== inputValue) {
                    ctrl.$setViewValue(transformedValue);
                    ctrl.$render();
                }

                return transformedValue;
            });
        }
    };
};

app.directive('onlyInteger', onlyInteger);
}());

<div class="row bottom-spaced-small">
        <div class="col-md-3">
            Number
        </div>
        <div class="col-md-9">
            <input name="txtNumber" only-integer ng-required="true" ng-maxlength="50" ng-model="someNumber" class="form-control color-black" />
        </div>
        <div class="row" style="padding-left: 30px" ng-if="someForm.$submitted && !someForm.txtNumber.$valid">
            <span style="color: red">Number is mandatory and must be a non 0 positive number.</span>
        </div>
    </div>

这里有两件事，我删除了作为number type="number“的控件，并包含了作为属性的指令。

在控件中编写的模式几乎是绑定的和静态的。如果我们希望更通用一点，那么将模式作为属性传递，并在指令中捕获以针对该模式进行验证。

欢迎建议和更正。