javascript - 添加动态元素时进行 AngularJS 表单验证

Question

我有一个带有 AngularJS 验证的表单。
问题是我使用 Jquery 将输入元素添加到此表单，而 AngularJS 不会将这些元素添加到表单的验证中..
这是一个例子:http://jsfiddle.net/ULEsy/

var input = $compile($('<input type="text" ng-model="textinput" required />'))($scope);
$("#someform").append(input);

在示例中，即使输入字段无效(空 - 可以通过红色边框看到)，整个表单都是有效的。有帮助吗？

Answer 1

@Ephi我找到了解决这个问题的方法。显然，您需要先将元素附加到 DOM，然后才使用 $compile。此外，新元素需要一个名称。

参见 here

angular.module("app", []).controller('someController', function($scope, $compile) {   
    $scope.add = function() {
        var input = $('<input type="text" ng-model="textinput" name="x" required />');
        $("#someform4").append(input);    
        $compile(input)($scope);
    }
});