Bootstrap + Угловое динамическое меню не разрушается после сворачивается

Я следующий кодом, я пытаюсь показать разборное меню, пункты, которые я называю с AngularJS:Bootstrap + Угловое динамическое меню не разрушается после сворачивается

<div class="btn-group" role="group"> 
    <button type="button" class="btn navbar-toggle collapsed" data-toggle="collapse" data-target="#SearchMenu" aria-expanded="false"> 
     <i class="glyphicon glyphicon-th-list"></i> 
     <i class="glyphicon glyphicon-chevron-down"></i> 
     Search Menu 
    </button> 
</div> 

<div class="collapse navbar-collapse" id="SearchMenu"> 
    <div class="row"> 
     <div class="col-md-10"> 
      <ul class="nav navbar-nav"> 
       <li class="dropdown" ng-repeat="menuDetail in menu.data" > 
        <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{menuDetail.item.displayName}}<span ng-if="menuDetail.submenu" class="caret"></span></a> 
        <ul class="dropdown-menu" ng-if="menuDetail.submenu"> 
         <li ng-repeat="submenu in menuDetail.submenu"><a href="">{{submenu.displayName}}</a></li> 
        </ul> 
       </li> 
       <li> 
        <a href="" class="icon-menu-padding" data-toggle="tooltip" data-placement="bottom" title="Configurations"> 
         <span class="glyphicon glyphicon-cog"></span><span class="hidden-md hidden-sm"> Config</span> 
        </a> 
       </li> 
       <li> 
        <a href="" class="icon-menu-padding" data-toggle="tooltip" data-placement="bottom" title="Help"> 
         <span class="glyphicon glyphicon-question-sign"></span><span class="hidden-md hidden-sm"> Help</span> 
        </a> 
       </li> 
       <li> 
        <a href="#/" class="icon-menu-padding" data-toggle="tooltip" data-placement="bottom" title="Logout"> 
         <span class="glyphicon glyphicon-log-out"></span><span class="hidden-md hidden-sm"> Logout</span> 
        </a> 
       </li> 
      </ul> 
     </div> 
    </div> 
</div>

Когда работает, не имея возможности подключиться к серверу для извлечения пунктов меню, он отлично работает (отображается и скрывается должным образом даже без большинства параметров). Но при запуске на сервере и отладке с помощью F12 в chrome и в IE, после отображения меню, он не может снова свернуть.

Когда я нажимаю кнопку, чтобы снова скрыть меню, инструменты разработчика Chrome показывают, что он изменяется (см. Первое изображение), но через мгновение он возвращается к оригиналу (см. Второе изображение), поэтому я не удалось скрыть меню еще раз.

The moment when a click is made to the button to hide the menu

After an instant goes back automatically

Любые идеи или предложения?

Спасибо!

источник

2017-01-11 Julia

Решено. Оказывается, у меня есть целый HTML (с тегами html и body), вставляемый в представление. Я должен был бы вставлять html только из раздела div. Странно, что в Chrome работал просто отлично, но iE не мог справиться с этим.

спасибо

источник

2017-04-10 16:59:29 Julia

Я думаю, что у вас есть некоторые проблемы при загрузке зависимостей, так как код, который вы нам дали, отлично работает. Вы можете проверить это CodePen

Если вы собираетесь смешивать простой Bootstrap с угловой вы должны загрузить их в порядке, как это:

Bootsrap CSS
JQuery расслоение плотной
Bootstrap JS
Угловые JS

<head> 
    ... 
    <link rel="stylesheet prefetch" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"> 
    ... 
</head>

источник

2017-01-11 02:53:48 Hiraqui

Bootstrap + Угловое динамическое меню не разрушается после сворачивается

ответ

Смежные вопросы