在ui-select中显示对象的键值

时间:2015-07-14 08:48:17

标签: angularjs angular-ui ui-select

我使用ui-select填充一些数据作为选择,数据存储在一个对象数组中,“pageArray”,对象看起来像这样

{
    pageName: pageNameArray
}

例如,

[{"alpha": [1,2,3,4]}, {"beta":[3,4,5,6,7]}, {"gamma": [6,4,2,0]}, ....]

现在在ui-select中,我希望将选项显示为“alpha”,“beta”,“gamma”,...基本上是关键值,我该怎么做?

我现在使用的ui-select代码就是这个

<ui-select ng-model = "page1.selected" style="width: 200px;" on-select = "getHost1List()">
    <ui-select-match placeholder = "Choose a page">{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat = "page in pageArray | filter: {name: $select.search}">
        <span ng-bind-html = "page.name | highlight: $select.search"></span>
    </ui-select-choices>
</ui-select>

或者有更好的方法吗?

基本上在ui​​-select中,我想选择[“alpha”,“beta”,“gamma”,....]。当我们选择一个特定的名字时,应该选择相应的对象,例如,如果我们在列表中选择“alpha”,那么

page1.selected = { {"alpha": [1,2,3,4]} }

1 个答案:

答案 0 :(得分:4)

您可以这样做,将您的对象格式更改为此

{
    "name": pageName,
    "data": pageNameArray
}
在ui-select中,你可以查询只选择“name”(假设数组的名称是“arr”

<ui-select ng-model = "page1.selected" style="width: 200px;" on-select = "getHost1List()">
    <ui-select-match placeholder = "Choose a page">{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat = "page in array | filter: {name: $select.search}">
        <span ng-bind-html = "page.name | highlight: $select.search"></span>
    </ui-select-choices>
</ui-select>

选择选项时,会选择对象,因此您甚至可以访问所选对象的“数据”