在提交角度之前验证动态表单答案

【问题标题】：validate dynamic form before submitting angular在提交角度之前验证动态表单
【发布时间】：2015-10-27 15:03:45
【问题描述】：

我正在使用 ng-repeat 动态创建表单，并且它们具有一些验证属性（简化版）：

<div class="row" ng-repeat="defect in model.defects">
    <form name="form_{{defect.id}}" novalidate>
      <input ng-model="defect.name" required/>
      <input type="submit" ng-click="saveDefect(defect)"/>
     </form>
</div>

基本上我想做的是这样的：

$scope.saveDefect = function (defect) {
         if ($scope.<how to get the form name here>.$invalid) {
             return;
         }
}

由于表单名称是使用 id 动态创建的，我该如何访问它？当然也欢迎其他方式做同样的事情:)

【问题讨论】：

你没有将表单名绑定到任何变量吗？？？
@MohammadJavadSeyyedi 你是什么意思？
@Elger 我在我的答案中添加了一个代码剪辑器以更好地解释我的解决方案，请告诉我这是否是您想要的

标签： angularjs angularjs-validation

【解决方案1】：

您可以使用bracket notation 访问它：

$scope["form_"+defect.id]

我建议你做的是：

var app = angular.module("App", []);
app.controller("Ctrl", function($scope) {
  $scope.forms = {};
  $scope.list = [{id: 1}, {id: 2}];
  
  $scope.save = function(item) {
    if ($scope.forms["form_" + item.id].$invalid) {
      alert("error on form_" + item.id);
    }
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="App" ng-controller="Ctrl">
  <div class="row" ng-repeat="item in list">
    <form name="forms.form_{{item.id}}" novalidate>
      <input ng-model="item.name" required/>
      <input type="submit" ng-click="save(item)" />
    </form>
  </div>
</body>

【讨论】：

将表单放入对象中使其工作。现在你向我展示它让我意识到中继器会创建新的范围，否则它将无法工作。谢谢！