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

回答

相关问题