使用带有对象索引而不是对象名称的 ng-options 语法答案

【问题标题】：Using ng-options syntax with object index instead of object name使用带有对象索引而不是对象名称的 ng-options 语法
【发布时间】：2016-05-05 21:07:02
【问题描述】：

我正在使用 Angular 1，并且一直在尝试使用 ng-options 指令显示下拉列表值，唯一对我有用的是：

<selectdata-ng-options="key as value for (key,value) in JSON.ObjectName.ListValues"></select>

由于 JSON 的生成方式，我需要反复显示任意数量的下拉菜单。因此，使上述语法起作用的唯一方法是分配一个基于索引的值 Example: index[0] 代替 ListValues 。像这样的：

<select data-ng-options="key as value for (key,value) in JSON.ObjectName.index[0]">

我的 JSON 对象的格式为：

{
    "JSON": {
        "ObjectName": {
            "ItemValues": {
                "0000": "County",
                "0100": "City",
                "0200": "State",
                "0300": "Region",
                "0400": "Country"
            },
            "AreaValues": {
                "1111": "Metro",
                "11AA": "Subway",
                "2222": "Bus"
                "22BB": "Transit"
            }
        }
    }
}

我尝试将 JSON 分配给控制器中的范围对象并尝试在我的页面上显示，但如果我要对任意数量的下拉菜单执行此操作，则该方法将无法有效工作。

我唯一的其他选择是使用 JSON 索引来执行此操作

这种方法行得通吗？
我应该使用自定义指令吗？
有没有更好的方法来解决这个问题？

【问题讨论】：

标签： angularjs json angularjs-ng-options

【解决方案1】：

一个选项是将对象直接附加到控制器，而不是角度的 $scope 对象。

var this = ctrl;

ctrl.object //this should attach the object to he scope of the controller.

   &lt;select id="idName" name="name" ng-model"ctrl.object.ListValues" data-ng-options="key as key for (key,value) in ctrl.objectName.ListValues"&gt;&lt;/select&gt;

您可以使用上述代码访问每个选项并将它们显示到 html 中的选择元素。

我是 Angular 新手，所以如果这不正确，我深表歉意，但我之前用 ngOptions 做过类似的事情，这个解决方案似乎在你描述的场景中运行良好。

【讨论】：

另外，你的控制器提供了什么逻辑？有很多事情会影响您是否可以按预期显示信息。