Wie ngform zu überprüfen, gültig ist oder nicht

Question

I ng-repeat bin mit dynamisch steuert, wie unten

<div ng-form="mainform" ng-repeat="usr in users"> 
    <userdirective ng-form="innerform_idx_{{$index}}></userdirective> 
</div> 

in meinem Controller ich möchte überprüfen, ob innere Formen gültig sind oder nicht zu schaffen. Ich habe versucht, unten, aber es funktioniert nicht

for(i=0;i<users.length;i++) 
{ 
var innerformName="innerform_idx_"+i; 
    if($scope.mainform.innerformName.$valid) 
    { 
    // throwing undefined error. 
    } 
} 

Bitte legen nahe, wie kann ich von innerer Form dynamisch Gültigkeit überprüfen.

Danke,

Answer 1

Nach meiner Erfahrung einen dynamischen Namen für eine innere Form nicht gut zu erzeugen. Jedoch scheint eckig vollkommen in Ordnung zu sein, wenn mehrere innere Formen mit dem gleichen (statischen) Namen vorhanden sind.

Zum Validieren eines einzelnen inneren Formulars in der Steuerung können Sie die Gültigkeit der inneren Formulare als Parameter von der Ansicht an die Steuerung übergeben.

Es ist auch wichtig zu wissen, dass das übergeordnete Formular ungültig sein wird, wenn eines der untergeordneten Formulare ungültig ist. Dies kann verwendet werden, um alle innere Formulare gleichzeitig zu validieren.

-Code-Schnipsel zu demonstrieren:

var app = angular.module('myapp', []); 
 
app.controller('myctrl', function($scope) { 
 
    $scope.users = ['u1', 'u2', 'u3']; 
 
    $scope.validateForm = function(form) { 
 
    alert('form is valid: ' + form.$valid); 
 
    } 
 
});

.userform { 
 
    margin-bottom: 20px; 
 
} 
 
.invalid { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myapp" ng-controller="myctrl"> 
 
    <div ng-form="parentform"> 
 
    <div class="userform" ng-repeat="user in users" ng-form="innerform"> 
 
     <div>Username (maximum 5 characters): {{user}}</div> 
 
     <input ng-maxlength="5" ng-model="user" /> 
 
     <div ng-class="{'invalid': !innerform.$valid}">inner form is valid: {{innerform.$valid}}</div> 
 
     <button ng-click="validateForm(innerform)">Check my validy in the controller</button> 
 
    </div> 
 
    <div ng-class="{'invalid': !parentform.$valid}">Parent form is valid: {{parentform.$valid}}</div> 
 
    </div> 
 
</div>