首页 文章

如何在angular2应用程序的下拉列表中显示选定值下的一些内容?

提问于
浏览
0

我开发了角度2应用程序,左侧导航栏有下拉列表 . 但我想要的功能就像我在导航栏的下拉列表中选择值时,它只显示选定下拉值下的一些链接列表 .

这是我编写的代码,用于显示导航栏中的下拉列表:

<li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
      <ul class="dropdown-menu" role="menu">
        <li><a href="#">Action</a></li>---->if I select Action from Drop Down menu then some list of links displayed under the selected value only related to Action value. 
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li><a href="#">Separated link</a></li>
        <li class="divider"></li>
        <li><a href="#">One more separated link</a></li>
      </ul>
    </li>

这是我想要的角度2应用程序功能的图像:

enter image description here

那么,任何人都可以建议我如何在angular 2应用程序中编写上述功能的代码?

1 回答

  • 0

    如果您正在使用Material Design,则可以执行以下操作:

    <md-select placeholder="Something" [(ngModel)]="YourModel" name="something" required>
          <md-option *ngFor="let item of menuItems" [value]="item.value">{{item.text}}</md-option>
     </md-select>
    

    在组件内部,您必须创建包含要显示的文本和值的菜单项(menuItems)数组 .

相关问题