How to add an array size validation rule in an angularjs form?

Question

I have a form with some text input fields and a dynamic list of items stored in the $scope of the controller, with some functions to add/remove items in the list. I want to invalidate the form until the items list reaches a predefined length.

So I created a formRepeat directive which takes a ngModel attribute and then use the ngModelController to invalidate the form.

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

This works but I think it's not the better way to do that as the directive is not very flexible.

The easiest would be to invalidate the form in the controller with something like :

$scope.myForm.$valid = false;

But this doesn't work.

Is there a better way ?

Answer 1

The easiest way for me was to target array's length as hidden number input and put min validation on it. Very clean solution, in fact.

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

Check out the updated plunker