如何檢查ngform是否有效

Question

我使用NG-重複在我的控制器動態創建控件如下

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

我要檢查，如果內部形式是有效還是無效。 我試過以下，但它不工作

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

請建議我怎麼能動態檢查內部形式的有效性。

謝謝，

Answer 1

根據我的經驗，生成一個內部形式的動態名稱不起作用。然而，對於具有多個具有相同（靜態）名稱的內部窗體，角似乎是非常好的。

要驗證單個控制器中的內部窗體，您可以將內部窗體有效性作爲參數從視圖傳遞到控制器。

知道如果任何子窗體無效，父窗體將無效也很重要。這可以用於同時驗證所有內部表單。

代碼片段演示：

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>