Question

我有一个非常简单的ng-repeat来创建手风琴。我从中删除了in类，因此它们被关闭了。但是我实际上希望它首先打开然后关闭所有其他按钮。

任何想法我该怎么做？

<div ng-repeat="ticket in tickets">
  <div class="panel-group" id="accordion{{ticket.TICKET_ID}}">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion{{ticket.TICKET_ID}}" href="#collapse{{ticket.TICKET_ID}}">{{ticket.TICKET_ID}} - {{ticket.TITLE}} ({{ticket.TICKET_STATUS_DESCRIPTION}})</a>
        </h4>
      </div>
      <div id="collapse{{ticket.TICKET_ID}}" class="panel-collapse collapse">
        <div class="panel-body">
          {{ticket.DESCRIPTION}}
          <hr>
          <span><b>Contacted by: </b> {{ticket.TICKET_TYPE_DESCRIPTION}}</span><br>
          <span><b>Category: </b> {{ticket.TICKET_CATEGORY_DESCRIPTION}}</span><br>
          <span><b>Related to: </b> {{ticket.TICKET_TAG_DESCRIPTION}}</span>
        </div>
        <div class="panel-footer">{{ticket.CREATED_BY}} - {{ticket.CREATION_DATE}}</div>
      </div>
    </div>
  </div>
</div>

Answer 1

您可以使用ng-class来有选择地添加collapse类，这将阻止第一个面板崩溃：

 <div id="collapse{{ticket.TICKET_ID}}" class="panel-collapse" ng-class="{ 'collapse': $index !== 0 }">
   <div class="panel-body">
     ...

我在这里敲了一个例子： https://codepen.io/anon/pen/NzMexQ?editors=1010

有条件的HTML

1 个答案: