2015-11-23 3 views
3

Я не могу получить этот код выгрузки для «выпадающего списка».Bootstrap Dropdown

Я запускаю это в среде MEAN (угловой js).

html работает отлично, но нет элемента выпадающего списка. enter image description here

<li class="dropdown"> 
<a class="dropdown-toggle" data-toggle="dropdown">Change Customer<span class="caret"></span></a> 
<ul class="dropdown-menu" role="menu"> 
<li><a href="#!">Customer</a></li> 
<li><a href="#!">Customer</a></li> 
<li><a href="#!">Customer</a></li> 
</ul> 
</li> 

Почему не появляется выпадающий функциональность?

+0

Включили ли вы загрузочный javascript? Я не уверен на 100%, но думаю, что это необходимо для этого. –

+0

Используете ли вы оригинальный код JSuery Bootstrap (который использует jQuery) или ** UI Bootstrap **, который переписан JS-кодом в Angular директивы? –

+0

В то время как я работал с Bootstrap, я написал эту маленькую грань, как руководство, проверив ее [gist] (https://gist.github.com/KhaledMohamedP/fe09a24b582e5679d802). В общем, вы пропустили, чтобы включить bootstrap '.js' файл, вам также нужен jquery. – KhaledMohamedP

ответ

2

Это потому, что вы не включали Bootstrap Javascript

добавить это в конце вашего тела секции

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
-1
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
0

Try, чтобы проверить, есть все, что нужно в файле.

Где-то в вашем HTML должно быть это (если вы используете CDN):

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" integrity="sha384-aUGj/X2zp5rLCbBxumKTCw2Z50WgIr1vs/PFN4praOTvYXWlVyh2UtNUU0KAUhAX" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script> 

Источник кода явно here.

Лучшая практика заключается в том, чтобы положить его в конец html-файла для уменьшения времени загрузки.