AngularJs驗證器與許多動態創建的輸入形式

我試圖創建一個使用ng重複許多行輸入的形式。每行有許多輸入，用戶輸入每行的值加起來到每行特定的值，例如AngularJs驗證器與許多動態創建的輸入形式

值= 20輸入1 = 10，輸入2 = 10, 值= 24輸入1 = 14，輸入2 = 10,

從這裏用戶只能提交表格，如果每一行都完整和正確。因此，我想使用ng-show =「entireForm。$ valid」來顯示提交按鈕。

這可能嗎？我一直在這個問題上停留了很多天，並且因爲我是新的Angular而完全混淆了。至少我創建了視圖並設置了無內部邏輯的驗證器。由於意見在那裏我不能確定，如果這甚至有可能與NG-重複

MM.app.directive（「lineitemvalidator」，函數（）{

return { 
    require: 'ngModel', 
    restrict: 'A', 
    link: function(scope, elm, attrs, ctrl) { 
     ctrl.$validators.lineItemValidator = function(modelValue,viewValue) { 

      var totalInputHrs = parseFloat(scope.childForm.bill.$viewValue) + parseFloat(scope.childForm.drawDown.$viewValue) 
      + parseFloat(scope.childForm.carryForward.$viewValue) + parseFloat(scope.childForm.writeOff.$viewValue) + parseFloat(scope.childForm.roundUp.$viewValue); 


      if((totalInputHrs==parseFloat(scope.lineItem.billableTime))){ 

       /*scope.childForm.bill.$valid=true; 
       scope.childForm.drawDown.$valid=true; 
       scope.childForm.carryForward.$valid=true; 
       scope.childForm.writeOff.$valid=true; 
       scope.childForm.roundUp.$valid=true; 

       scope.childForm.drawDown.$setValidity("drawDown", true); 
       scope.childForm.bill.$setValidity("bill", true); 
       scope.childForm.carryForward.$setValidity("carryForward", true); 
       scope.childForm.writeOff.$setValidity("writeOff", true); 
       scope.childForm.roundUp.$setValidity("roundUp", true); 

       scope.childForm.$setValidity("childForm",true,scope.childForm); 
        */ 
       console.log("Form valid should = true"); 
       console.log(scope.childForm); 
       return true; 
       console.log("Form valid = "+scope.childForm.$valid); 
      }else{ 
       /*scope.childForm.bill.$valid=false; 
       scope.childForm.drawDown.$valid=false; 
       scope.childForm.carryForward.$valid=false; 
       scope.childForm.writeOff.$valid=false; 
       scope.childForm.roundUp.$valid=false; 
       scope.childForm.drawDown.$setValidity("drawDown", false); 
       scope.childForm.bill.$setValidity("bill", false); 
       scope.childForm.carryForward.$setValidity("carryForward", false); 
       scope.childForm.writeOff.$setValidity("writeOff", false); 
       scope.childForm.roundUp.$setValidity("roundUp", false); 

       scope.childForm.$setValidity("childForm",true,scope.childForm); 
        */ 
       console.log("Form valid = "+scope.childForm.$valid); 
       return false; 
       console.log("Form valid = "+scope.childForm.$valid); 
      } 
     } 
    } 
};

來源

2014-12-03 user3240957

您將有量使用ng-form這種情況下，每個表單都會有一些特定於其輸入字段輸入和驗證。如果任何一個子表單驗證失敗時，父窗體自動被標記爲$valid或$invalid。

的設置會是這個樣子：

<form name='entireForm'>\ 
    <ng-form name='formChild' ng-repeat='item in items'> 
     <input name='input1' ng-model='item.field1'/> 
     <input name='input2' ng-model='item.field2'/> 
    </ng-form> 
</form>

每個ng-form都可以單獨驗證，並且entireForm表單的整體狀態僅在所有子級有效時纔有效。

來源

2014-12-03 11:20:11 Chandermani

唯一的問題是我試圖創建一個表，因此每行都是ng-repeat的成員，例如數據「novalidate>中的 user3240957 2014-12-03 11:41:44

另外我如何訪問特定於子窗體的元素。例如輸入2是子窗體1，我想訪問輸入2也檢查其值？ @Chandermani – user3240957 2014-12-03 11:54:58

是的，你會遇到桌面問題，也許你可以看看基於網格的引導佈局。 – Chandermani 2014-12-03 12:03:23

AngularJs驗證器與許多動態創建的輸入形式

回答

相關問題