NG-選擇及其angularjs

性能我一直在試圖找出如何使用數組，如果對象是一個NG-選擇指令NG-選擇及其angularjs

這個鍵值是我想用數據

$scope.selectValues [ 
    {name: "Options 1", value: "11"}, 
    {name: "Options 2", value: "22"} 
    {name: "Options 3", value: "33"} 
];

，我想輸出是

<select> 
    <option value="11">Options 1</option> 
    <option value="22">Options 2</option> 
    <option value="33">Options 3</option> 
</select>

誰能解釋如何做到這一點？並顯示一個設置指令的例子？我曾看過這些文檔，但他們沒有適合這種模型的示例。

來源

2013-12-19 Edgar Martinez

ng-options支持基於數組和基於對象的數據源。例如：

陣列爲基礎的數據源：基於

$scope.options = ["Blue", "Red", "Yellow"] 

<select ng-model="selected" 
     ng-options="for o in options">

對象數據源：

$scope.options = { 
    "Blue": "color_1", 
    "Red": "color_2", 
    "Green": "color_3" 
} 

<select ng-model="selected" 
     ng-options="name for (name, value) in options">

但是，使用的是用於基於陣列的選項不兼容的數據結構。您可以使用像這樣：

<select ng-model="selected" 
     ng-options="o.name for o in options">

並使用所選值作爲selected.value。（selected綁定到數組中的一個對象）。如果你想通過HTTP提交表單，這將不起作用，所以在這種情況下，你應該將選項轉換爲上述的一種數據結構。

我已經包括了這三種用法這裏：http://plnkr.co/IEBQkqJNifY5MZWloDP6

編輯：所以我的文檔，今天再次看了一下，發現與原始數據結構的工作方式。

<select ng-model="selected" 
     ng-options="o.value as o.name for o in options">

plnkr也被更新。

來源

2013-12-19 02:56:21 tungd

感謝這工作。關於這個的文檔是非常有限的，但現在我改變了我的數據結構，並且一切正常。再次感謝 –

對不起，我忽略了文檔。有一種方法可以處理原始數據結構，請參閱我的編輯。 – tungd

@ tungd真棒！ – changus

NG-選擇及其angularjs

回答

相關問題