嵌套 HTML 表单替代答案

【问题标题】：Nesting HTML form alternative嵌套 HTML 表单替代
【发布时间】：2014-05-08 11:21:27
【问题描述】：

我正在尝试将上传模块 (ngUpload) 添加到我的代码中。问题是 ngUpload 使用 HTML 表单，我需要将它放在另一个 HTML 表单中以进行布局。这是我的设置的样子：

<form name="form" novalidate>
<div class="form-group addscript">
...
    <form ng-upload="uploader(content)" method="post" action="/upload" name="foo" enctype="multipart/form-data">
      <p class="help-block"><input type="file" name="file"></p>
      <a href='javascript:void(0)' class="upload-submit" ng-click="saveData()">Upload</a> 
    </form>
...
</div>
</form>

而且我知道我不能嵌套 HTML 表单，那么解决这个问题的最简单方法是什么？也许有一种方法可以将上传表单“注入”到外部表单，而不会违反嵌套表单的概念？

【问题讨论】：

如果您使用的是 AJAX，则根本不需要表单。

标签： javascript html forms angularjs

【解决方案1】：

在 angularjs 中你可以嵌套这样的表单：

<form name="form1">
    <div ng-form="" name="form2">
    </form>
</form>

ngForm 的行为与实际的 form 完全相同

【讨论】：

我对angular不是很熟悉，但这不是无效的xml吗？
ng-form 的存在是为了嵌套表单。 docs.angularjs.org/api/ng/directive/ngForm
感谢您的出色回答。不幸的是，我不能使 ngUpload 指令与 ngForm 一起工作（似乎只在 i form 标签内工作）。所以我想我必须找到另一种方法来做到这一点。
如果其他人正在为 ngUpload 苦苦挣扎，我发现这个模块似乎可以解决问题：github.com/danialfarid/angular-file-upload，因为它不直接依赖于原生 HTML 表单。