Angularjs中没有显示Bootstap Dropdown子菜单?

时间:2018-05-22 04:11:09

标签: angularjs twitter-bootstrap

我正在尝试创建一个下拉菜单,它包含子菜单。但子菜单没有显示。我的代码如下。如果有任何错误,请告诉我。谢谢。

<div class="dropdown ">

    <span class="dropdown-toggle glyphicon glyphicon-option-vertical" data-toggle="dropdown"></span>

    <ul class="dropdown-menu  pull-right ">
        <li class="dropdown-item ">Books</li>
        <li class="dropdown-submenu">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
               Games</a>
            <ul class="dropdown-menu" ng-repeat="game in games">
                <li class="dropdown-item " ng-click="getGames()">
                    {{game.name}}
                </li>
            </ul>
        </li>
    </ul>

下拉菜单包含两个菜单项,即Books和Games。在选择游戏之后,它应该显示来自后端的游戏名称列表,但它没有显示。实际上我可以在不使用bootstrap下拉菜单的情况下获取游戏名称。我没有给出正确的代码。我只需要下载子菜单的suggeions。所以我只给了那部分代码。

1 个答案:

答案 0 :(得分:0)

你应该把ng-repeat放在里面而不是ul。

更改此代码:

  <ul class="dropdown-menu" ng-repeat="game in games">
            <li class="dropdown-item " ng-click="getGames()">
                {{game.name}}
            </li>
        </ul>

到此代码:

  <ul class="dropdown-menu" >
            <li class="dropdown-item " ng-click="getGames()" ng-repeat="game in games">
                {{game.name}}
            </li>
        </ul>