我的手风琴怎么没有塌陷？ - 相同的工作

Question

http://plnkr.co/edit/xUuZyQTES83yccFRcc4K?p=preview

查看我的 plunker，它复制了我的确切问题。我尽可能地修剪了我的代码。

我还尽可能多地浏览了我的代码。不幸的是，我无法找到第一组手风琴与导致第一组手风琴不起作用的第二组手风琴之间如此显着的不同之处。

第一组（不工作）：

        <div ng-repeat="x in numOfMaps" class="{{x.count}}Details">
          <li class="m2Details m3Details"><a data-toggle="collapse" dataTarget="#{{x.count}}toggleBuilding" href="#">Building<span class="caret"></span></a></li>
          <ul id="{{x.count}}toggleBuilding" class="accordion-body {{x.buildingOpen}}">
              <li ng-repeat="y in this[x.count + 'InfoBuilding']" class="{{y.linkclass}}"><a href="{{y.link}}" ng-click="clickLinks(y.initialOut,y.initialIn,y.backIn,y.backOut,y.name)"><img src="{{y.icon}}" width="15px" height="15px">{{y.name}}</a></li>
          </ul>
        </div>
        <div ng-repeat="x in numOfMaps" class="{{x.count}}Details">
          <li class="m2Details m3Details m4Details"><a data-toggle="collapse" dataTarget="#{{x.count}}toggleOffsite" href="#">Offsite<span class="caret"></span></a></li>
          <ul id="{{x.count}}toggleOffsite" class="accordion-body {{x.offsiteOpen}}">
              <li ng-repeat="y in this[x.count + 'InfoOffsite']" class="{{y.linkclass}}"><a href="{{y.link}}" ng-click="clickLinks(y.initialOut,y.initialIn,y.backIn,y.backOut,y.name)"><img src="{{y.icon}}" width="15px" height="15px">{{y.name}}</a></li>
          </ul>
        </div>

此代码包含在另一个 ul 标记和其他内容中..但我怀疑其中任何一个都会产生影响，因为否则一切正常，但这里是一个骨架副本：

<div>
 <ul>
  <li><img></li>
  <li ng-repeat=""><a>{{text}}</a></li>
  <li><a><span>Text</a></li>
     ///first set of code (above)
 </ul>
</div>

第二组（工作）：

<ul ng-repeat="x in numOfMaps" class="buildingDropdown {{x.count}}Details {{locationsVisibility}}">
        <a class="btn btn-primary btn-block" id="toggleHeader" data-toggle="collapse" data-target="#{{x.count}}LocationsList" href="#"><span>Locations</span><span class="caret"></span></a>
        <ul id="{{x.count}}LocationsList" class="accordion-body collapse buildingListDropdown">
          <a ng-repeat="y in this[x.count + 'InfoBuilding']" href="{{y.link}}" class="{{y.linkclass}}" ng-click="clickLinks(y.initialOut,y.initialIn,y.backIn,y.backOut,y.name)"><li>{{y.name}}</li></a>
          <a ng-repeat="y in this[x.count + 'InfoOffsite']" href="{{y.link}}" class="{{y.linkclass}}" ng-click="clickLinks(y.initialOut,y.initialIn,y.backIn,y.backOut,y.name)"><li>{{y.name}}</li></a>
        </ul>
    </ul>

有人想看看吗？这可能是一些小而令人尴尬的事情，比如“DOH！”片刻。非常感激。 :)

Answer 1

你是对的 - 这是小事！

你不小心把data-target 的一些属性用驼峰式化了：

<li class="m2Details m3Details">
  <a data-toggle="collapse" dataTarget="#{{x.count}}toggleBuilding" href="#">
    Building
    <span class="caret"></span>
  </a>
</li>

注意dataTarget 应该是data-target。