Question

所以我试图验证ng-repeat中一个项目的输入。例如，我可以说我有5个项目（1,2,3,4,5），如果选择了第4个项目，我只想验证表格。

我之前使用ng-pattern来验证表单，但没有使用下拉菜单来选择item.name

我已经包含了正则表达式，我希望在ng-pattern中验证第4项。

<div>
  <select name="name" ng-model="item.name" ng-options="item for item in items" required></select>
</div>

<div>
  <input name="results" type="text" ng-model="item.results" ng-pattern="/^\d\d\d\/\d\d\d/" required>
</div>

非常感谢任何有关验证此情况的正确方法的建议。我已经考虑过创建一个指令来验证这一点，但感觉这是一个过于复杂的解决方案，因为我不会在这个应用程序中多次使用该指令。

/////////////////////////////////////////////// ///

它不会让我回答我自己的问题，所以这里是我想出的答案。

我最终要做的是使用ng-pattern并将其传递给函数。

<input name="results" type="text" ng-model="vital.results" ng-pattern="vitalRegEx()" required>

这是控制器代码

$scope.item4RegEx = /^\d{2,3}\/\d{2,3}$/;

  $scope.itemRegEx = function() {
    if($scope.item && $scope.item.name === "fourth item")
      return $scope.item4RegEx;
    else return (/^$/);
  };

Answer 1

或者......

在select下拉列表中添加ng-change指令，该指令调用Controller方法，并且该控制器方法设置是否验证表单的标志。

例如

<select ng-change="checkIfFormShouldbeValidated()" ng-model="item.name"></select>

// Inside controller
$scope.checkIfFromShouldBeValidated = function(){
   if( $scope.item.name == 4th Item ) $scope.shouldValidate = true;
   else $scope.shouldValidate = false;
};


$scope.formSubmit = function(){ 
    if(($scope.shouldValidate && form.$valid) || (!$scope.shouldValidate)){
        // Submit Form  
    } 
};

看看它是否有帮助。

Answer 2

我在控制器中编写了这个递归函数来检查所有子范围的有效性。

function allValid(scope) {
    var valid = true;
    if (scope.$$childHead) {
        valid = valid && allValid(scope.$$childHead);
    }
    if (scope.$$nextSibling) {
        valid = valid && allValid(scope.$$nextSibling);
    }
    if (scope.scorePlannerForm) {
        valid = valid && scope.myForm.$valid;
    }
    return valid;
}

然后在我的控制器中，我用控制器范围检查它。

function formSubmit() {
      if (allValid($scope)) {
           // perform save
      }
}

ng-repeat中的AngularJS表单验证

2 个答案: