Angular 在角度视图中创建3级（多级）下拉列表

如何在angular中创建3个level下拉选项。我们可以利用角材料吗

<h4>mat-select</h4>
<mat-form-field>
  <mat-label>Pokemon</mat-label>
  <mat-select [formControl]="pokemonControl">
    <mat-option>-- None --</mat-option>
    <mat-optgroup *ngFor="let group of pokemonGroups" [label]="group.name"
                  [disabled]="group.disabled">
      <mat-option *ngFor="let pokemon of group.pokemon" [value]="pokemon.value">
        {{pokemon.viewValue}}
      </mat-option>
    </mat-optgroup>
  </mat-select>
</mat-form-field>





The above code has two level. But how can we make it to the  3 level. 
   Something like, 
   Label1 -> Option1 -> option1.1 and option1.2  
   Label1 -> Option2 -> option1.1 and option1.2 
   Label2 -> Option2 -> option1.1 and option1.2

体积计量学->[IOPS，Kbps]->[Read，Write] 如何通过3个级别实现这种下拉

如果有任何帮助，我们将不胜感激

---

我们可以使用html/angular，但最好使用angular材质？

考虑组合-mat select和mat菜单组件来实现下拉菜单，这样它就可以像我们上面预期的那样容纳多个级别

演示-

在这里，我使用mat select作为禁用项，并在下拉菜单上单击“显示多级mat”菜单。一旦用户从菜单中选择任何项目，我们将设置下拉列表的值

---

我知道这是一种非常规的方法，但是如果它满足要求，你可以考虑采用这种方法。

考虑结合-Mat Stand和Mat菜单组件来实现下拉菜单，使它可以容纳多个级别，正如我们预期的那样。 演示-

在这里，我使用mat select作为禁用项，并在下拉菜单上单击“显示多级mat”菜单。一旦用户从菜单中选择任何项目，我们将设置下拉列表的值

---

我知道这是一种非常规的方法，但是如果它符合要求，你可以考虑采用这种方法。

看看这里的最后一个例子：也许你可以使用菜单组件来实现它。谢谢Paul的建议。但缺陷在于，它的行为不像下拉菜单，如何从按钮单击中检索值？嗨，这方面有任何更新吗？请看最后一个示例：。也许你可以使用菜单组件来实现它。谢谢Paul的建议。但缺陷在于它不具有下拉功能，如何从按钮单击中检索值？嗨，有什么更新吗？