2014-02-06 84 views
0

爲什麼我的下拉列表中有重複的名稱?還有我怎麼打開下拉菜單切換到一個下拉按鈕,而無需在左AngularUI下拉菜單中有重複項

http://test.shibagames.com/

這裏黑色子彈的代碼:

<!DOCTYPE html> 
<html ng-app="plunker"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <link data-require="[email protected]" data-semver="3.0.3" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" /> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" src="http://code.angularjs.org/1.2.10/angular.js" data-semver="1.2.10"></script> 

     <link rel="stylesheet" type="text/css" href="css/main.css" media="screen" /> 
    <link href="menu_source/styles.css" rel="stylesheet" type="text/css"> 
    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"> 

<link rel="stylesheet" href="css/chromeSafari.css" type="text/chrome/safari" /> 

    <!-- Optional theme --> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css"> 
    <link rel="stylesheet" href="dist/css/bootstrap.min.css" type="text/css"> 

    <!-- Latest compiled and minified JavaScript --> 
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> 
    <script src="music.js"></script> 
     <script src="example.js"></script> 

    <script data-require="[email protected]" src="http://code.angularjs.org/1.2.10/angular.js" data-semver="1.2.10"></script> 
    <script src="app.js"></script> 
    <script src="javascript/main.js"></script> 
      <script src="angular.min.js"></script> 
       <script src="ui-bootstrap.min.js"></script> 




</head> 

<body> 

<li class="dropdown" ng-controller="DropdownCtrl"> 
    <a class="dropdown-toggle"> 
    Click me for a dropdown, yo! 
    </a> 
    <ul class="dropdown-menu"> 
    <li ng-repeat="choice in items"> 
     <a>{{choice}}</a> 
    </li> 
    </ul> 
</li> 



    </body> 

</html> 

app.js

var app = angular.module('myApp', []); 

function myCtrl($scope) { 
    $scope.active = { val : '' }; 
    $scope.Activate = function(buttonVal) { 
     $scope.active.val = buttonVal; 
    }; 

} 

example.js

angular.module('plunker', ['ui.bootstrap']); 
function DropdownCtrl($scope) { 
    $scope.items = [ 
    "The first choice!", 
    "And another choice for you.", 
    "but wait! A third!" 
    ]; 
} 

回答

0

有很簡單的解釋:你是包括AngularJS 3倍(!):

倍一般來說它看起來像這個測試頁面的依賴項沒有得到很好的管理:

  • 你正在使用Bootstrap的JavaScript,如果你想使用Bootstrap的JavaScript,你也需要jQuery,這不包括在內。
+0

如何在不破壞下拉代碼的情況下從下拉按鈕中刪除項目符號? – user3159568