AngularJS幫助綁定表單輸入

Question

我是AngularJS/WebDev的新手，一直在尋找處理我遇到的問題的最佳方法。

我有任何數據的數組，通過ng-options在窗體上填充下拉列表。 （下面的例子）

$scope.products = [ 
    { name: 'ALD', data1: 'ALDdata', data2: 'ALDdata2', data3: 'ALDdata3' }, 
    { name: 'BLD', data1: 'BLDdata', data2: 'ALDdata2', data3: 'ALDdata3' }, 
    { name: 'ELD', data1: 'ELDdata', data2: 'ALDdata2', data3: 'ALDdata3' } 
    ], 

一旦用戶選擇了一個選項，我將如何將它的每個屬性綁定到單個文本框。

<input type="text" value="{{data1}}" /> 
<input type="text" value="{{data2}}" /> 
<input type="text" value="{{data3}}" /> 

我一直堅持這個近4個小時，無休止的谷歌搜索出現沒有相關的結果。我非常感謝任何幫助提前。

UPDATE：

我已經找到了解決的工作的jsfiddle我的問題，但是，它是利用AngularJS的舊版本。有人可以幫助我在1.2.2中完成這項工作嗎？

http://jsfiddle.net/n7ZCg/3/

Answer 1

你要找的NG-型號：

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

http://docs.angularjs.org/api/ng.directive:input.text

在你的榜樣，你想要的：

<input type="text" ng-model="data1" /> 
<input type="text" ng-model="data2" /> 
<input type="text" ng-model="data3" /> 

注缺乏括號;你正在命名一個範圍成員，而沒有將其價值替換到位。

Answer 2

的$scope.products是值的數組，所以你需要ng-repeat的是，這就像一個foreach 所以試試這個方法在下文

<ul> 
    <li ng-repeat="product in products"> 
    <input type="text" ng-model="product.data1" /> 
    <input type="text" ng-model="product.data2" /> 
    <input type="text" ng-model="product.data3" /> 
    </li> 
</ul> 

還是試試吧，這下面的代碼顯示陣列價值的第一指標。

<input type="text" value="{{products[0].data1}}" /> 
<input type="text" value="{{products[0].data2}}" /> 
<input type="text" value="{{products[0].data3}}" />