Question

我需要使用angular验证（限制最小和最大选择）复选框组。是否有任何指令来实现角度验证。

<html ng-app="app">
<head>
    <title>AngularJS Routing</title>
    <script src="http://code.angularjs.org/1.2.7/angular.js"></script>
    <script type="text/javascript">
        var app = angular.module('app', []);

        app.controller('CHKctrl', function ($scope) {
            $scope.data = [{ "name": "CHK 1" },
                         { "name": "CHK 2" },
                         { "name": "CHK 3" },
                         { "name": "CHK 4" },
                         { "name": "CHK 5" },
                         { "name": "CHK 6" }];
        });
    </script>
</head>
<body ng-controller="CHKctrl">
    <form name="form">
        <label ng-repeat="d in data">
            <input 
                type="checkbox"
                ng-model="d.value"
                minlength="2"
                maxlength="4"/>
                {{d["name"]}} &nbsp; &nbsp;
        </label>
        <br />
        <br />
        {{data}}
    </form>
</body>
</html>

Answer 1

是的;

<input
  ng-model="string"
  [name="string"]
  [required="string"]
  [ng-required="boolean"]
  [ng-minlength="number"]
  [ng-maxlength="number"]
  [ng-pattern="string"]
  [ng-change="string"]
  [ng-trim="boolean"]>
...
</input>

你可以检查输入，如

<tt>myForm.$error.minlength = {{!!myForm.$error.minlength}}</tt><br/>
<tt>myForm.$error.maxlength = {{!!myForm.$error.maxlength}}</tt><br/>

您在HERE处查看。

对于复选框 添加这些并根据您的要求进行改进，这是一条适合您的道路;

<input ng-disabled="(count>max) && (!d.check)" type="checkbox" ng-checked="d.check" ng-model="d.value" minlength="2" maxlength="4" ng.click="countCheck(d)"/>

JS：

$scope.count = 0;
$scope.max = 3;
//You can swap it with ".watch"
yourController.countCheck = function(d){
    if(d.check){
        $scope.count++;
    }else{
        $scope.count--;
    }
}

Angularjs复选框组最小和最大验证限制

1 个答案: