将ng-options与嵌套数组一起使用 [英] Using ng-options with nested arrays

问题描述

我正在从服务器中获取一些数据.数据结构为:

I am getting some data back from my server. The data structure is:

[{"sectorName1": "nameHere",
  "subSectors": ["sub1", "sub2", "sub3"]
 },
 {"sectorName2": "nameHere",
  "subSectors": ["sub1", "sub2", "sub3"]
 }]

我试图用ng-options显示每个扇区的subSectors.因此，当某些人使用下拉菜单时，他们将看到所有子部门.

I am trying to display each sectors subSectors with ng-options. So when some uses the dropdown they will see all the subsectors.

我已经尝试过了，但是似乎没用:

<select id="selectSubSector" class="form-control" name="subSector" ng-model="item" ng-options="sec for sec in mySectors.subSectors ">
</select>

其中mySectors是从服务器返回的数据.

有什么建议吗?

推荐答案

我创建了 jsfiddle ，还更新了您的响应数据:

I have created a jsfiddle, have updated your response data as well:

HTML:

<div ng-app="app" ng-controller='TestCtrl'>
    <select ng-model="selectData">
        <option value="">Select</option>
        <optgroup ng-repeat='item in data' label="{{item.sectorName}}">
            <option ng-repeat="option in item.subSectors">{{option}}</option>
        </optgroup>
    </select>
</div>

JS

var app = angular.module('app', []);

app.controller('TestCtrl', function ($scope) {
    $scope.data = [{
        "sectorName": "nameHere1",
        "subSectors": ["sub1", "sub2", "sub3"]
    },
     {
         "sectorName": "nameHere2",
         "subSectors": ["sub1", "sub2", "sub3"]
     }];
});

这篇关于将ng-options与嵌套数组一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！