您的代码不起作用的唯一原因可能是 $scope.keywords 是一个简单的变量(带有文本值)而不是一个必需的对象 - 请参阅http://docs.angularjs.org/api/ ng.$http#Usage
由于 angularJS 在其自身范围内使用变量 - 它的模型,表单成为与这些模型交互的一种方式,可以通过您想要的任何方法发送。
你可以有一个隐藏的字段,是的,但在 angularJS 中甚至没有必要。您只需要在控制器本身中定义该信息 - 为每个实例随机生成,或从其他来源接收。或者您可以自己定义它,例如在控制器加载时。
所以(并且只是为了清楚起见)如果你在你的 formCtrl 中定义一个 formData 变量:
你的 HTML:
<div ng-app>
<div ng-controller="SearchCtrl">
<form class="well form-search">
<input type="text" ng-model="formData.title">
<input type="textarea" ng-model="formData.body">
<button ng-click="sendData()">Send!</button>
</form>
<pre ng-model="result">
{{result}}
</pre>
</div>
</div>
和你的控制器:
function SearchCtrl($scope, $http) {
$scope.url = 'qa/vote_up'; // The url of our search
// there is a formData object for each instance of
// SearchCtrl, with an id defined randomly
// Code from http://stackoverflow.com/a/1349426/1794563
function makeid()
{
var text = "";
var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
for( var i=0; i < 5; i++ )
text += possible.charAt(Math.floor(Math.random() * possible.length));
return text;
}
$scope.formData = {
title: "",
text: ""
};
$scope.formData.id = makeid();
// The function that will be executed on button click (ng-click="sendData()")
$scope.sendData = function() {
// Create the http post request
// the data holds the keywords
// The request is a JSON request.
$http.post($scope.url, { "data" : $scope.formData}).
success(function(data, status) {
$scope.status = status;
$scope.data = data;
$scope.result = data; // Show result from server in our <pre></pre> element
})
.
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
};
}
另外:如果你想在 html 本身上设置唯一的 id,你可以添加一个 input type="hidden" 并将它的 ng-model 属性设置为 formData.id,无论你设置哪个值,模型都会有它绑定。使用隐藏输入将不起作用,因为 value 属性不会更新通过 ng-model 分配的 angularJS 模型。改用 ng-init 来设置值:
具有 2 种形式的 HTML:
<div ng-controller="SearchCtrl" ng-init="formData.id='FORM1'">
<form class="well form-search">
<input type="text" ng-model="formData.title">
<input type="textarea" ng-model="formData.body">
<button ng-click="sendData()">Send!</button>
</form>
</div>
<div ng-controller="SearchCtrl" ng-init="formData.id='FORM2'">
<form class="well form-search">
<input type="text" ng-model="formData.title">
<input type="textarea" ng-model="formData.body">
<button ng-click="sendData()">Send!</button>
</form>
</div>
您可以添加一个隐藏字段,但它什么也没做 - ng-init 属性可以满足您的所有需求。