AngularJS 中的 ng-list 长度验证答案

【问题标题】：ng-list length validation in AngularJSAngularJS 中的 ng-list 长度验证
【发布时间】：2015-09-23 10:55:08
【问题描述】：

我需要验证 ng-list，意味着应该限制用户输入三个以上的数组列表，例如 ['121','565','435']，如果用户尝试像 ['121','565','435','787'] 一样输入，应该给出错误，例如只有 3 个 vin 可以输入。

此外，如果用户像上面一样输入['**1214**','565','435']，它应该告诉它只允许 3 位数字。

这是我的输入框：

<input type="text"  name="vin" id="vin" class="form-control"
 ng-model="vm.user.vin" ng-list required max-length="3"/>

我是 AngularJS 的新手。

【问题讨论】：

哦..很紧急？好吧，让我把所有事情都清理干净，为你写代码。首先向我们展示你的作品。
我投票结束这个问题，因为用户要求为他编写代码
@sirrocco ...酷。他向我们提供了足够的细节。还有I am new in angular js，这就是他要求从SO 编写代码的原因。 :) ...
plnkr.co/edit/BQzp18gi7gksWG8OlXp0?p=preview 在这里我正在验证 minlength 和 maxlenth .. 意味着如果您在输入框中输入 1212,erere,erere,erere,erer 它将给出 maxlength exceeded 错误.. 同样的方式minlength 也是如此.. 我需要将 1212 限制为 121.. 我无法做到
plnkr.co/edit/3YhEjKc2v48Eu0GRYmxX?p=preview

标签： angularjs angular-nglist

【解决方案1】：

我不知道 ng-list 的默认验证属性，但您可以自定义验证，如

<input type="text" name="vin" id="vin" class="form-control"
                        ng-model="vm.user.vin" ng-list required max="3" ng-change="isBigEnough(vm.user.vin)" />

                    <span ng-show="vm.user.vin.length > 3">array length should below than three</span>
                    <span ng-show="IsElementLength">element length should below than three</span>

和你的控制器端代码

$scope.isBigEnough = function (values) {
        if (values != undefined) {
            values.every(function (element, index, array) {
                if (element.length > 3) {
                    $scope.IsElementLength = true;
                    return false;
                }
                $scope.IsElementLength = false;
                return true;
            })
        }

    }

结果

['121','565','435'] - 没有错误信息

['1211','565','435'] - 元素长度应小于三个

['121','565','435','543']- 数组长度应小于三

['1211','565','435','543']- 数组长度小于三，元素长度小于三

我已经将代码带到了plunker，但我没有在 plunker 上测试它。

【讨论】：

这里如果我提交表单，即使有错误 IsElementLength