Angular UI手风琴上的全尺寸可点击面板(?)

时间:2014-12-26 15:36:33

标签: javascript angularjs twitter-bootstrap angular-ui

问题很简单,我不知道为什么我没有得到我想要的行为,这是Angular UI Bootstrap accordion that I am using,但正如你在这个例子中所看到的那样打开手风琴的唯一方法如果你点击标题,并且这不是我想要的,现在看看this example, this is what I want,你点击面板的位置无关紧要,面板只会打开你是否点击标题与否。

这是我正在使用的代码:

    <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 个答案:

答案 0 :(得分:7)

实际上我只是想出来,只需将accordion-heading内容放入div

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