Question

使用以下HTML，无法验证步骤：

<form name="myForm">
<input type="number" name="test" min={{min}} max={{max}} step={{step}}>
<div class="error-popup" ng-if="myForm.test.$touched && myForm.test.$valid">
     <p>Invalid number</p>
</div>
</form>

例如，如果$scope.min=3，$scope.max=9和$scope.step=0.3，myForm.test.$valid对于3.4或4.3等值仍然如此，则不应该如此。所以，我正在考虑使用ng-pattern。是否可以构造仅允许ng-pattern值的min+x*step或者我应该为此构建指令？

Answer 1

您错过了输入字段的ng-model。请加上。

＆＃13;

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>

    <div ng-app="myApp" ng-controller="myCtrl">
        <form name="myForm">
            <input ng-model="yourValue" type="number" name="test" min={{min}} max={{max}} step={{step}}>
        </form>
        <h1>Validity: {{myForm.test.$valid}}</h1>
        <div class="error-popup" ng-if="myForm.test.$touched && myForm.test.$valid">
            <p>Invalid number</p>
        </div>
    </div>

    <script>
        var app = angular.module('myApp', []);
        app.controller('myCtrl', function ($scope) {
            $scope.min = 3;
            $scope.max = 10;
            $scope.step = 2;
        });
    </script>


</body>

</html>

＆＃13;

验证类型编号输入内的步骤

1 个答案: