javascript - ng-options 中的键值对

Question

我需要使用关联数组作为我select使用 AngularJS 的选项的数据源。

是否可以使用这样的数组？

{
    "key1": "val1",
    "key2": "val2",
    "key3": "val3",
    ...
}

得到这样的东西：

<select>
    <option value="key1">val1</option>
    <option value="key2">val2</option>
    <option value="key3">val3</option>
    ...
</select>

我阅读了文档，但我不明白如何实现这一点。

score 168 · Accepted Answer

<select ng-model="blah" ng-options="key as value for (key , value) in data"></select>

<select>
    <option ng-repeat="(key, value) in data" value="{{key}}">{{value}}</option>
</select>

$scope.data = {
    "key1": "val1",
    "key2": "val2",
    "key3": "val3",
    ...
};

score 21 · Accepted Answer

以下文章讨论了您可以使用 ngOptions 的各种方式（迄今为止我见过的最清晰、最彻底的解释）：http ://www.undefinednull.com/2014/08/11/a-brief-walk -通过-of-the-ng-options-in-angularjs/

score 3 · Accepted Answer

Chen-Tsu Lin 的回答实际上给出了访问对象的两种方式。只想再添加几行 -

因为该ng-repeat指令为数组中的每个项目重复一段 HTML 代码，所以它可用于在下拉列表中创建选项，但该ng-options指令专门用于使用选项填充下拉列表，并且至少具有一个重要优点：

下拉ng-options列表允许选择的值是一个对象，而下拉列表ng-repeat必须是一个字符串。

添加示例以供参考：

3 回答 3