AngularJS - 如何将表单提交到服务器上的控制器？答案

【问题标题】：AngularJS - How do I submit a form to a controller on the server?AngularJS - 如何将表单提交到服务器上的控制器？
【发布时间】：2011-05-21 14:54:57
【问题描述】：

AngularJS site 上的食谱表单示例仅保存客户端上的状态。如何提交到服务器？

另外，如何在ng:click="save()" 函数中的表单上使用jQuery 的form.submit()？

编辑 - 找到 2 种方法来做到这一点（我还删除了我之前粘贴的 HTML 标记 - 只需参考源代码的高级表单食谱示例）

http://webpac2.rot13.org:3000/conference/Work（Dobrica Pavlinusic）采用 AngularJS 方式，使用资源以 JSON 格式将数据发送到服务器。我在服务器端遇到了问题 - AngularJS 发送它很好，但 grails 正在破坏它（根据萤火虫和请求内容长度）。我需要更多地研究这个。如何更改 $save() 等资源方法的 Angular 内容类型？
放入表单并使用提交按钮。由于我不是在做单页网络应用程序，所以我使用了这种方法。大多数验证都在客户端上，而服务器上的更多验证对我来说已经足够了。

只是把它放在这里，以便其他人可以将它用于可能的解决方案和最佳方法。

【问题讨论】：

你能显示你当前的标记和代码吗？回复你的 PS：这可能和它可能一样糟糕......
@marcel - 没有正确渲染我的复制粘贴。我希望你能理解这一点。感谢您的帮助
您能否在发送到浏览器时显示 HTML 标记（使用“查看源代码”），这样我们就不必弄清楚生成的 HTML 会是什么样子。毕竟，这是 JavaScript 会看到的。

【解决方案1】：

注意，view（你的 html 模板）和 logic（你的 JS 代码）是严格分开的——主要是因为可测试性。

正确的方法是将模型发送到服务器，使用 $resource（用于 REST）或低级 $http。而不是在模板中完成工作。

简单示例 - HTML 模板

First: <input type="text" ng-model="person.first" />
Last: <input type="text" ng-model="person.last" />
<button ng:click="save()">Save</button>

JavaScript - 控制器

function FormCntl($scope, $http) {
  $scope.save = function() {
    $http.put('/save.py', $scope.person);
  };
}

【讨论】：

如果我使用this.save = function...，那是行不通的。我必须在控制器中使用$scope.save = function...。
@Voles 谢谢，已更新为当前 v1 语法（答案是用 0.9.* 语法编写的）
当我将请求转储到服务器端时，没有提交任何内容。这是一个空数组：Log::write(print_r($_REQUEST,true))
@itcouldevenbeaboat 您需要将其包装到 <form> 标签中，然后在输入时会调用该按钮。
@PineappleUndertheSea 不确定您的情况是什么问题，但在将其发送到服务器之前尝试console.log($scope.person)...

【解决方案2】：

据我所知，并没有真正的好方法来修改 Angular 发送到服务器期望 editing angular source 的标头。这是计划中的增强功能，但尚未完成。

我认为angular google group 可能是提出此类特定问题的更好地方，因为开发人员非常友好且知识渊博。

【讨论】：