Question

我无法让我的下拉列表工作。我可以让导航栏显示完美，但是当我点击＆＃34; Dropdown＆＃34; （它们中的任何一个）它不显示下拉菜单。我试过在其他帖子上看到这个，但没有任何解决每个人的问题都有帮助。以下是我的代码请告诉我问题并提前致谢。

<!doctype html>
<html class = "no-js" ng-app = "app" lang = "en">
<head>
    <meta charset = "utf-8">
    <title ng-bind = "title"> </title>
    <meta name = "description" content = "">
    <meta name = "viewport" content = "width = device-width">
    <link rel = "stylesheet" href = "http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
    <link rel = "stylesheet" href = "styles/main.css">

    <link rel = "stylesheet" href = "http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css">
    <link rel = "stylesheet" href = "http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

<head profile = "http://www.w3.org/2005/10/profile">
    <meta name="google-signin-scope" content="profile email">

    <style>
        body {

            background-size: cover;
            background-position: top center;
        }
    </style>
</head>

<body>
<div class = "container" >
    <header class = "header">
        <div id="headerText" style="visibility: hidden">
            <span style="font-family: calibri; font-size: 30pt;"> </span>
            <nav id = "top-nav" class = "pull-right">
                <ul class = "nav nav-pills">



                    <li id = "reports" disabled>
                        <a ng-href = "#/reports"> Reports
                            <span class = "visuallyhidden" class="btn btn-primary pull-right"> - currently selected </span>
                        </a>
                    </li>


                    <li class="dropdown">
                        <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                            <li><a tabindex="-1" href="#">Action</a></li>
                            <li><a tabindex="-1" href="#">Another action</a></li>
                            <li><a tabindex="-1" href="#">Something else here</a></li>
                            <li class="divider"></li>
                            <li><a tabindex="-1" href="#">Separated link</a></li>
                        </ul>
                    </li>
                </ul>
            </nav>
        </div>
    </header>
</div>

<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script>
<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.js"></script>
<script src = "scripts/app.js"></script>
<script src = "scripts/controllers.js"></script>
<script src = "http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src = "http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src = "http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src = "http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src = "http://code.highcharts.com/highcharts.js"></script>
<script src = "http://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/highcharts-3d.js"></script>

<script src = "https://apis.google.com/js/client.js"></script>
<script src = "http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script>
<script src = "http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src = "http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
<script src = "http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/3.0.0/js/bootstrap-datetimepicker.min.js"></script>
<script src = "http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.4.0/lang/en-gb.js"></script>
</body>
</html>

Answer 1

你没有在你的脚本中包含ui-bootstrap的库，首先请包含ui-bootstrap.js脚本，之后注入依赖关系，如下所示

angular.module('myModule', ['ui.bootstrap']);

下拉列表未显示

1 个答案: