javascript – 添加动态元素时的AngularJS表单验证

2019年8月4日 153次阅读

我有一个AngularJS验证表单.

问题是我使用
Jquery向此表单添加输入元素,而AngularJS不会将这些元素添加到表单的验证中.

这是一个例子：
http://jsfiddle.net/ULEsy/

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

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

最佳答案
@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);
    }
});
点赞