Question

这是我的json数据如何使用angular JS

设置下拉列表控件的选定选项

$scope.alltoys=[
       {
         "dId": "570b886545034f0001718247",
         "dName": "Toys",
         "dSubName": "Comics",
         "users": [
           {
                "name": "Superman",
                "id": "570b9e3a45034f000171827b"
           },
           {
                "name": "Batman",
                "id": "570ba00045034f000171828a"
           }]
       },
       {
        "dId": "5767c68c52faff0001fb8555",
        "dName": "Toys",
        "dSubName": "General",
        "users": [
           {
                "name": "Jack",
                "id": "570b9e3a45034f000171827b"
           },
           {
                "name": "Sparrow",
                "id": "570ba00045034f000171828a"
           }]
        }
]

如何使用角度js填充此选择框

我想像这样填充

Toys-Comics
    Batman
    Superman
Toys-General
    Jack
    Sparrow

在这里玩具漫画＆amp; Toys-General仅是所选内容的标题我想在填充时对用户数组进行排序。

<div class="controls">
    <select class="form-control" ng-model="toy"
        ng-options="eachtoy as eachtoy.dName+' - '+eachtoy.dSubName group by eachtoy for eachtoy in alltoys">
        <option value="">---------------Select---------------</option>
    </select>
</div>

我尝试了这个，但它没有用。

Answer 1

一些变化。首先，确保$ scope.alltoys是一个集合（数组），如下所示：

listVendorEmail.get(i)

然后更改您的html以处理具有optgroup的组，如下所示：

$scope.alltoys = [{
  "dId": "570b886545034f0001718247",
  "dName": "Toys",
  "dSubName": "Comics",
  "users": [{
    "name": "Superman",
    "id": "570b9e3a45034f000171827b"
  }, {
    "name": "Batman",
    "id": "570ba00045034f000171828a"
  }]
}, {
  "dId": "5767c68c52faff0001fb8555",
  "dName": "Toys",
  "dSubName": "General",
  "users": [{
    "name": "Jack",
    "id": "570b9e3a45034f000171827b"
  }, {
    "name": "Sparrow",
    "id": "570ba00045034f000171828a"
  }]
}];

这是一个有效的plunk

如何在angularJS中填充选择框？

1 个答案: