30

我正在将一个旧的 html 页面从 jQuery 迁移到 Angular，它包含一些带有<input type="submit">. 当我用指令丰富我的页面时ng-app，旧表单停止工作（我的意思是当你按下submit按钮时没有任何反应）。

我搜索了这个问题并扫描了 Angular 文档，但似乎没有人再提交表单了。

任何关于如何在没有太多击键的情况下使这些形式重新焕发生机的建议将不胜感激。

目前该表单具有以下标记：

<form name="form_upload" method="post" action="" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" name="send" value="Upload">
</form>

我清除了所有 jQuery 代码并从 Angular 重新开始。

升级版：

我想我现在找到了原因，它是空action属性，似乎标准不欢迎空动作，但使用起来非常方便，允许您将表单提交到当前页面 URL，有 Angular 方法吗？

4

3 回答 3

18

离开文档：http ://docs.angularjs.org/api/ng.directive:form

Angular 的理念是尽量减少数据和页面重新加载，因此它们不喜欢“旧式表单”，但您可以通过action在表单中​​使用属性来绕过它。

Angular 在设计时考虑了单页应用程序，并避免了整页重新加载，因为这将花费更长的时间。通过使用该ngSubmit指令，您可以定义一个函数来将表单数据发送到服务器并获得比重新加载整个页面更快的响应。字节而不是千字节。

于 2013-06-05T17:12:16.997 回答
11
  • 使用非空action属性让 Angular 提交表单
  • 用当前位置填充action属性（使用角度）

在您的控制器中：

$scope.location = $window.location.href

在您的 HTML 中：

<form action="{{location}}">

请参阅plunkr 演示。

于 2014-04-23T10:33:28.227 回答
0

我已经做到了。我很确定我使用 jquery 来提交表单，但您可能可以使用普通的旧 javascript 来完成。

角度表单页面上的评论之一暗示了这一点：

<input onclick="javascript:$(this).parent().submit();" type="submit" value="">

http://docs.angularjs.org/api/ng.directive:form

于 2013-06-05T17:27:45.137 回答