You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

AngularJS中用ng-options实现带条件optgroup的嵌套数组选择

问题:AngularJS ng-options实现动态optgroup下拉(无SubValues直接选,有SubValues作为组)

我现在需要实现一个AngularJS的下拉选择框,需求是:

  • 如果某个选项的SubValues数组为空,这个选项本身可以直接被选择
  • 如果选项包含SubValues,则该选项作为optgroup,只有它下面的子项可以被选择

我的数据源(简化后)

[{ 
  "Id": "1", 
  "Name": "Option (WITHOUT SubValues) - should be selectable", 
  "SubValues": [] 
}, { 
  "Id": "2", 
  "Name": "Option (WITH SubValues)", 
  "SubValues": [
    { "Id": "2-1", "Name": "SubValue - should be selectable" }, 
    { "Id": "2-2", "Name": "SubValue2 - should be selectable" } 
  ] 
}]

当前使用的ng-options代码

<div ng-app="myApp"> 
  <div ng-controller="myController"> 
    <div class="col-md-4"> 
      <div class="form-group"> 
        <select ng-model="myType" class="form-control" 
                ng-options="item.Id as item.Name for item in data.d"> 
        </select> 
      </div> 
    </div> 
  </div> 
</div>

我自己尝试过类似这样的写法,但显然达不到预期效果:

<select ng-model="myType" class="form-control" 
        ng-options="item.Id as item.SubValues[1].Name group by item.Name for item in data.d">

想请教一下:在当前的数据结构下,能不能直接实现我要的效果?如果不行的话,最优的实现方案是什么?

内容的提问来源于stack exchange,提问作者Wayne

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.15 03:17:26