Twitter bootstrap 引导折叠不向后折叠

我有一个包含（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>

{{item.info}
一些文本

现在，当我单击info标记时，具有相应类的div正在折叠打开。但当我再次点击它时，它永远不会折叠。只有当我包裹在导航栏和导航栏内部时，它才会向后折叠……当然，我不想这样

---

这方面有什么帮助吗？

当我在代码中添加一个控制器时，一切似乎都按预期工作：

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"
    }
  ];


}

另请参见：您使用的版本可能会有问题吗？我使用了jQuery1.9.1、TwitterBootstrap2.3.1和AngularJS1.0.7（参见：）

---

BTW，您是否考虑使用UI引导程序（）：（感谢WHO回答）

当我用硬编码的类名来尝试您的代码时，它似乎起作用：请参见。你确定你的

{{item.$$hashKey}}

设置正确了吗？奇怪……结果是，当我移除周围的转发器（手风琴项目是在ng repeat中创建的）时，一切正常。即使我硬编码多个项目。我更新了html以说明更多内容。ng-repeat有不同的作用域，另请参见：您应该使用ng-click事件来添加/删除类中的.in。@basjobsen感谢您的帮助。不幸的是，我没有看到这个问题（我是个新手）。你能给我解释一下吗？我试试看。Twitter引导使用jQuery进行DOM操作（添加或删除.in类）。Angular创建新的DOM元素（手风琴项目）。jQuery不知道这些元素，因为它们是在其他范围（角度）中创建的。此视频可能有帮助。感谢您的帮助。事实证明，我自己的一些CSS欺骗了我。打开时，可折叠div位于切换按钮的顶部。因此，我再也不能单击按钮将div滑回。这很有道理，不是吗。我的坏，很好，现在可以用了。我学到了很多关于angularJS和UI引导的知识，这也很好：）