Angular Js：驗證表

Question

中的重複對象鍵我有一個表有兩列「用戶類型」和「用戶名」用戶類型有一個下拉選擇所以，我可以選擇預定義的用戶類型，並在用戶名。每次點擊都有一個添加按鈕，我將添加另一行。

我在這裏做一個驗證因此，用戶不能選擇重複的「用戶類型」。例如第1行的 是我從下拉列表中選擇「值1」。然後從第2行我不應該能夠選擇相同的值。無論如何，這種驗證工作正常。 但有一種情況，如果我添加一個重複行，然後立即刪除它，我仍然無法保存，因爲驗證錯誤仍然存​​在。

這裏我JSP-

 <div ng-class="{'col-sm-9'}" class="col-md-10"> 
     <table class="table table-bordered table-striped table-hover table-condensed"> 
      <thead> 
       <th>user type</th> 
       <th>user Name</th> 
       <th></th> 
      </thead> 
      <tbody> 
       <tr ng-repeat="object in edituserConfig track by $index" ng-form="jobfileForm"> 
        <td><select class="form-control" ng-model="object.key" required ng-change="reValidateJob()" name="jobFileKey" ng-init="object.form = jobfileForm"> 

          <option style="display:none" value=""></option> 
          <option value="value1">value1t</option> 
          <option value="value2">value2</option> 
          <option value="value3">value3</option> 
          <option value="value4">value4</option> 
          <option value="value5">value5</option> 
        </select></td> 
        <td><input type="text" class="form-control" name="jobFileName" ng-model="object.value" required/></td> 

        <td > 
          <button class="btn btn-danger btn-sm" data-style="zoom-in" ng-click="edituserConfig.splice($index,1)" ng-form="jobfileForm" title="Delete"> 
           <span class="glyphicon glyphicon-remove"></span> 
          </button> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="3"> 
         <button class="btn btn-primary btn-sm" ng-click="edituserConfig.push({'key':'','value':''})" title="Add Value"> 
          <span class="glyphicon glyphicon-plus"></span> Add Value 
         </button> 
        </td> 
       </tr> 
      </tbody> 
     </table> 
     </div> 

我的控制器 -

 $scope.reValidateJob = function(){ 

       angular.forEach($scope.edituserConfig, function(fieldMapO) { 
        var count = 0; 
        angular.forEach($scope.edituserConfig, function(fieldMapI) { 
         if(fieldMapO.key == fieldMapI.key){ 
          count ++; 
         } 
        }); 
        if(count >1){ 
         fieldMapO.form.jobFileKey.$setValidity("duplicate",false); 
        }else{ 
         fieldMapO.form.jobFileKey.$setValidity("duplicate",true); 
        } 
       }); 
      }; 

請告訴我上刪除按鈕做我需要再次vaidate所有行？任何好的解決方案

Answer 1

嗯，我認爲以下應該工作。如果沒有，我會請求你創建一個js-fiddle或plunker。

添加reValidateJob到NG-單擊Add按鈕像下面

<button class="btn btn-danger btn-sm" data-style="zoom-in" ng-click="edituserConfig.splice($index,1); reValidateJob();" ng-form="jobfileForm" title="Delete"> 
    <span class="glyphicon glyphicon-remove"></span> 
</button> 

希望這有助於！