創建動態表單並在AngularJS中進行驗證/發佈

Question

我在AngularJS中有一個帶有用戶名和密碼輸入字段的登錄表單。上面有一個按鈕來加載註冊表單。然後，電子郵件字段將被添加到表單中。

但是，當我提交註冊表格時，只會發佈用戶名和密碼輸入字段，而不會發送電子郵件字段。

Send Data after Login: {"username":"test","password":"test"} 
Send Data after Register: {"username":"test","password":"test"} 

你知道爲什麼嗎？

我創建了一個Plnkr來說明問題：有 http://embed.plnkr.co/HBEfITT3SNSZv44hj2x3/preview

Answer 1

你的附加字段是一個元素中

ng-if="register" 

NG-如果是創建自己的範圍指令。因此，如果在<input ng-model="email" ...>字段中輸入了某些內容，則會在ng-if範圍中創建並填充電子郵件屬性，而不是在控制器範圍中創建。

憑經驗：總是在你的NG-model的點，始終初始化控制器中的表單模型：

$scope.formModel = {}; 

<input ng-model="formModel.email" ...> 

這也會讓事情變得更簡單，因爲發佈的形式，你必須要做的就是像

$http.post(url, $scope.formModel).then(...);