异步加载表单的AngularJS验证

Question

我正在构建一个包括模态窗口的AngularJS应用程序，该模态窗口包含表单并异步加载到DOM中（单击相应的按钮时）。 表格工作正常，但我无法正确检查它们是否有效。 这是一个例子：

HTML

<div ng-app="myapp" ng-controller="MyCtrl">
    <form novalidate name="myform" ng-submit="submitForm(myform)">
        <input type="text" required ng-model="myname" />
    </form>
</div>

JavaScript的

var app = angular.module('myapp', []);
app.controller("MyCtrl", function($scope) {
    $scope.submitForm(form) {
        if(form.$valid) {
            // Do http stuff here
        }
    };
});

如果此表单是异步加载的，则form变量的值为NaN，并且form。$ valid是未定义的。 但是，如果我将其与页面的其余部分一起加载，则工作正常。 有谁知道如何强制AngularJS填充表单的范围变量？ 谢谢！

Answer 1

当您使用ng-include包含表单时，将创建childScope。 父范围和子范围不能访问彼此的范围。 因此。$ valid变为空。

前几天，我遇到了类似的问题，并找到了适合我的解决方案：

childScope表单上的AngularJS $ setValidity