如何在angularjs表单中添加数组大小验证规则？

Question

我有一个表单,其中包含一些文本输入字段和存储在控制器的$ scope中的项目的动态列表,其中一些函数用于添加/删除列表中的项目.我想使表单无效,直到项目列表达到预定义的长度.

所以我创建了一个formRepeat指令,该指令接受ngModel属性,然后使用ngModelController使表单无效.

http://plnkr.co/edit/jSFvak?p=preview

这有效,但我认为这不是更好的方法,因为指令不是很灵活.

最简单的方法是使控制器中的表单无效:

$scope.myForm.$valid = false;

但这不起作用.

有没有更好的办法 ？

Answer 1

对我来说最简单的方法是将数组的长度作为隐藏数字,input并对其进行min验证.事实上,非常干净的解决方案.

<input style="display: none;" type="number" name="itemsCount" ng-model="items.length" min="{{min}}">

查看更新的plunker

Answer 2

根据你的笨蛋。我会使用以下$watch函数（类似于@NicolasMoise 响应）

$scope.$watch('items', function (items) {
    $scope.myForm.$setValidity('count', items.length >= 5);
}, true);

objectEquality将标志设置为很重要，true以便$watch在任何对象属性发生更改时都会触发

或者，如果仅进行浅列表（集合）比较，请使用$watchCollection

$scope.$watchCollection('items', function (items) {
    $scope.myForm.$setValidity('count', items.length >= 5);
});

我也从未有过任何运气$setValidity('$valid')或类似的事情