Angular UI手风琴上的全尺寸可点击面板（？）

The question is simple, and I don't know why I am not getting the behavior I want, this is the Angular UI Bootstrap accordion that I am using but as you can see on that example the only one way to open the accordion is if you click on the title, and that's not what I want,now look at this example, this is what I want, it doesn't matter where you click on the panel, the panel just will open whether you click on the title or not.

这个问题很简单,我不知道为什么我没有得到我想要的行为,这是我正在使用的Angular UI Bootstrap手风琴,但正如你在这个例子中所看到的,打开手风琴的唯一方法是if你点击标题,这不是我想要的,现在看看这个例子,这就是我想要的,无论你点击面板在哪里,面板都会打开你是否点击标题。

and here is the code I am using:

这是我正在使用的代码:

    <accordion close-others="false">
      <accordion-group class="fx-fade-right fx-speed-300"
        ng-repeat="sport in sports | filter:query"
        ng-show="sport.leagues.length">
          <accordion-heading>
            {{::sport.name}}
            <span class="pull-right badge">{{::sport.leagues.length}}</span>
          </accordion-heading>
          <div class="list-group leagues-margin"
            ng-click="addSportToLines(sport)">
            <a href="javascript:void(0);" class="list-group-item"
              ng-repeat="league in sport.leagues"
              ng-class="{active: league.active}"
              ng-click="addLeagueToLines(league)">{{::league.name}}
            </a>
            <a href="javascript:void(0);"
              class="list-group-item list-group-item-danger"
              ng-hide="sport.leagues.length">No Leagues
            </a>
        </div>
      </accordion-group>

1 个解决方案

#1

actually I just figured that out, just place the accordion-heading content into a div:

实际上我只是想出来,只需将手风琴标题内容放入div中:

      <accordion-heading>
        <div>
          {{::sport.name}}
          <span class="pull-right badge">{{::sport.leagues.length}}</span>
        </div>
      </accordion-heading>