Passing through all instances of the internal form of the ng-form for verification

Question

I created a plunker .

I generate input elements dynamically when the "+ Name" button is pressed, each inside an ng form.

How can I capture all instances of an ng form to validate each individual ng form? So that the "+ Name" button remains disabled if the fields are invalid or a new ng form is created?

Edit Details on the structure of the form

There are other fields in the form that I deleted for brevity. This is basically a long form, something like

<form name="myForm"> <input name="one" /> . . <div ng-repeat....> <ng-form> <input name="schoolName" /> </ng-form> </div> <button>+ Name</button> <!-- I cannot check for myForm.$valid here--> <!-- since the person might not filled the rest of the below fields --> <!-- hence the need to grab "each" "ng-form" --> <input name="some" /> <input name="other" /> </form> 

Answer 1

1) http://docs.angularjs.org/api/ng.directive:form say:

In angular forms can be nested. This means that the outer form is valid when all child forms are also valid.

Therefore, your main form will be valid only when all child forms are created.

2) if you want / should have links to child elements of FormControllers in the main form, you need to use custom directives.

I am updating your code: http://plnkr.co/edit/Vvz6VXJUj4lF0NR9gjjL

• script.js contains 2 directives: "mainForm" and "childForm", which show you how they can interact.
• The Results section in index.html shows when "mainForm" becomes valid. And, as you can see, this confirms that the Angular.js documentation says