引導程序崩潰不倒塌

我有一個頁面，其中包含（Twitter）引導程序。在這個頁面上，我有一個完美的手風琴，在那個手風琴裏面我有一個可摺疊的div。請參見下面的代碼：引導程序崩潰不倒塌

<div class="accordion" id="checkListAccordion"> 
<div ng-repeat="item in items" class="accordion-group"> 
    <div class="accordion-heading"> 
     <a class="accordion-toggle" data-toggle="collapse" data-parent="#checkListAccordion" href="#collapse{{item.$$hashKey}}">{{item.name}}</a>  
    </div> 
    <div id="collapse{{item.$$hashKey}}" class="accordion-body collapse"> 
     <div class="accordion-inner"> 
      <div class="container-fluid"> 
       <div class="row-fluid"> 
        <div class="badges span12"> 
         <span class="badge badge-info" data-toggle="collapse" data-target=".info{{item.$$hashKey}}"><i class="icon-info-sign icon-white"></i></span> 
         <div class="info{{item.$$hashKey}} collapse in"> 
          {{item.info}} 
         </div> 
        </div> 
       </div> 
       <div class="row-fluid"> 
        <div class="span12"> 
         some text 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

現在，當我點擊信息徽章，與相應的類股利被翻開。但是當我再次點擊它時，它永遠不會折回。只有當我在導航欄和導航欄內部換行時，它纔會折回......但當然，我不想那樣。

對此有何幫助？

來源

2013-05-30 Bas Slagter

當我嘗試似乎工作硬編碼類名稱代碼：請參見http：// bootply。 COM/62667。你確定你的'{{item。$$ hashKey}}'設置正確嗎？ –

奇怪...事實證明，當我刪除周圍的中繼器（手風琴項目是在ng-repeat中創建的），一切正常。即使我硬編碼多個項目。我更新了html來說明更多。 –

ng-repeat具有不同的範圍，請參閱：http://stackoverflow.com/questions/16854463/jquery-addclass-doesnt-work-in-twitter-bootstrap-carousel-which-using-ng-repeat您應該使用用於添加/刪除.in類的ng-click事件。 –

當我一個控制器上的添加到您的代碼，一切似乎都按預期方式工作：

angular.module('plunker',[]); 
function AccordionDemoCtrl($scope) { 
    $scope.oneAtATime = true; 

    $scope.items = [ 
    { 
     name: "Dynamic Group Header - 1", 
     info: "Dynamic Group Body - 1" 
    }, 
    { 
     name: "Dynamic Group Header - 2", 
     info: "Dynamic Group Body - 2" 
    } 
    ]; 


}

參見：http://plnkr.co/nX4kvMThA0bYwcbXZS7t可能會有一個問題，您使用的版本？我使用jQuery 1.9.1，Twitter Bootstrap 2.3.1和angularJS 1.0.7（請參閱：Angular JS Bootstrap Accordian Example）。

順便說一句你有考慮使用UI引導（http://angular-ui.github.io/bootstrap/）見：http://plnkr.co/u7l6nrkPZM8ZJtA08RNP（感謝winkerVSbecks誰回答Howto set template variables in Angular UI Bootstrap? (accordion)）

來源

2013-06-01 22:40:19

感謝您的幫助。事實證明，我自己的一些CSS在愚弄我。摺疊式div在打開時位於切換按鈕頂部。因此，我不能再點擊按鈕來滑動div。這是有道理的，不是。我的錯。 –

現在很好用。我學到了很多關於angularJS和UI Bootstrap，這也不錯:) –

引導程序崩潰不倒塌

回答

相關問題