angular怎么对select的option循环树形下拉菜单？

Question

[
      name : "游戏",
      children : [
            {
                  name : "王者荣耀"
            }，
            {
                  name : "绝地求生"
            }
      ]
]

<select class="form-control">
    <option *ngFor="let g of gameList;">
          {{g.name}}
          
    </option>
    
</select>

有什么写法能实现图中的demo吗？
如果在option标签里面写div。是不换行的。

Answer 1

不行。我没用过 Angular，不过这里至少不能用 <select> 来实现。你可以考虑自己实现一个组件来做。

Answer 2

同意一楼的建议，select是没法达到这种效果。自己可以写组件。应该有较多的插件可以达到你的需求。也可以参照别人写的组件自己写个适用自己的

Answer 3

那你也可看看用特殊字符构造这个树php好像经常会这么搞就是像树但是全部摊开。不能折叠，

Answer 4

最好用ul>li代替吧，然后根据自己需要的样式写css

data:[
      name : "游戏",
      children : [
            {
                  name : "王者荣耀"
            }，
            {
                  name : "绝地求生"
            }
      ]
]

<span>{{data.name}}</span>
<ul>
  <li>data.name</li>
  <li *ngFor="let g of data.children" >
    ------{{ g.name }}
  </li>
</ul>

给ul加一个ngIf判断显示隐藏，span加click事件控制