Question

我尝试使用验证制作嵌套表单。一切正常，但当我删除一个嵌套表单时，验证继续使用删除的表单。我制作了jsfiddle示例http://jsfiddle.net/sokolov_stas/VAyXu/

当示例运行时，表单有效。如果单击“+”按钮，将添加嵌套表单，有效将为false。然后单击“ - ”按钮，有效将全部为false。

问题是：如何从验证处理中删除动态创建的表单。

Answer 1

嗯，首先，<form> inside of a <form> is not valid HTML。

其次，你不应该在控制器内部进行DOM操作。控制器用于“业务”逻辑。 See the section on controllers here

对于你正在做的事情，你可能最好使用一个表格，在其中加入ng-repeat，并在数组中添加其他元素：

<form name="myForm" ng-controller="FormCtrl" ng-submit="doSomething()">
   <div ng-repeat="item in items">
      <input ng-model="item" type="text" required/>
   </div>
   <a ng-click="addItem()">+</a>
   <a ng-click="removeItem()">-</a>
   <button type="submit">Submit</button>
   <div>Form valid: {{myForm.$valid}}</div>
</form>

和控制器：

function FormCtrl($scope) {
   $scope.items = [];
   $scope.addItem = function() { 
       $scope.items.push(null);
   };
   $scope.removeItem = function() {
       $scope.items.pop();
   };
   $scope.doSomething = function () {
       //your submission stuff goes here.
   };
}

验证动态创建的表单（AngularJS）

1 个答案: