为什么我无法在 angularJS 的 ngInclude 中访问表单对象？

Question

我有一个用几个 ng-include 堆栈构建的屏幕。最后一个，特别的，我是根据用户配置建屏的。

有时，我必须在其中一个包含的模板中显示一个表单。当我的用户点击保存按钮时，我必须验证表单中的所有字段是否有效。

同时，当尝试访问表单对象时，检查 $valid，我的表单未定义。

经过一天的斗争，我发现 ng-include 进程不接受我要创建的表单对象。

我已经创建了这个 plunker 来查看它是否真的发生在一个简单的项目中，制作一个工作表格而不是一个工作表格： http://plnkr.co/edit/4oMZYLgaYHJPoSZdSctI?p=preview

基本上，创建了一个表单，像这样，具有要求的 angular 属性：

<form name="sampleForm">
    <input type="text" name="aws" required ng-model="myValue">
    <br/>myValue: "{{ myValue }}"
    <br/>

    <input type="text" name="aws" required ng-model="myValue">
    <br/>myValue: "{{ myValue }}"
</form>

并尝试像这样访问表单对象：

$scope.sampleForm.aws.$valid

结果是：

$scope.sampleForm === undefined

有人知道如何解决这个问题吗？

Answer 1

由于 ng-include 创建了一个新的范围，因此 $scope.sampleForm 将从包含的页面中取消定义。

解决方案应该是在包含的 HTML 页面本身内获取 ng-controller="formController" 声明，我认为这也是一个更好的设计，因为我看不到它不是 "controlling"表格.

其他未包含的形式显然如您所料。

Plunker

为什么我无法在 angularJS 的 ngInclude 中访问表单对象？

Why I can't access a form object inside a ngInclude on angularJS?

javascript

forms

angularjs

angularjs-ng-include