確定的正確方法,所以我創建一個表單,像這樣:AngularJS和嵌套形式:命名和聲明模型
<form novalidate class="simple-form" action="" name="mainForm" ng-submit="doSubmit()" method="POST">
<div ng-form name="giftForm" class="panel-body">
<input type="text"
id="x_amount"
name="x_amount"
class="form-control input-lg"
ng-model="giftForm.amount"
ng-required="true">
</div>
<div class="row">
<button type="submit" class="btn" ng-disabled="mainForm.$invalid">Submit</button>
</div>
</form>
這工作進行驗證,即MainForm的$無效的唯一亮點使按鈕後,輸入有文字。然而,使用batarang,我注意到,範圍看起來像這樣:
{"giftForm":{"x_amount":{},"amount":"a"}}
所以它是基於名稱和聲明NG-模型創建模型值。如果我改變他們是一樣的,像這樣:
<input type="text"
id="x_amount"
name="x_amount"
class="form-control input-lg"
ng-model="giftForm.x_amount"
ng-required="true">
的提交說明的正確範圍:
{"giftForm":{"x_amount":"a"}}
但輸入字段最初顯示與輸入[Object對象],這使得我覺得我在這裏混淆了一些東西.....我不能在所有的輸入字段中都有這個。
我希望名稱和模型相同。這似乎是漸進增強的方式將允許一個正常的非Ajax後通過簡單地移除NG提交方式和AJAX方式會是什麼樣子:
$http({
method : 'POST',
url : 'formAction.do',
data : $.param(angular.toJson($scope.mainForm)),
headers : { 'Content-Type': 'application/x-www-form-urlencoded' }
})
.success(function(data) {
//success
})
.error(function(data, status, headers, config) {
//error
});
任何人有見識到了什麼我失蹤或如果我的架構有缺陷,我將非常感激智慧....
好的,這改變了它,現在我看到了更多的東西,現在看着對象,giftForm從簡單的模型變成了看起來像formController的東西。 – jessehensold
所以我誤解了你是如何聲明這些的,但現在又回到了尋找ajax提交的所有子表單數據的最佳方法的原始問題。在範圍內創建的模型對象沒有什麼特別的地方嗎?因爲現在在mainForm對象上做一個angular.toJson將會返回的不僅僅是輸入數據......我會提出一個新問題。 – jessehensold
實際上我認爲''scope.giftForm'被'FormController'覆蓋,然後當''更新了它的模型時,'FormController'接收到另一個值。這是一個混亂,只是給他們不同的名字或會有麻煩。 –