繁体   English   中英

Angular-如何在ui界面手风琴上正确应用is-open属性?

[英]Angular - How to apply is-open attribute properly on angular ui accordion?

当您单击手风琴上的任何面板时,我有一个特定功能正在特别起作用。 现在,我在这里的原因是因为现在单击该功能会在您单击以打开或关闭面板时触发,而我不希望那样,我希望该功能仅在您单击面板以使其起作用时才起作用开放。 我看到可以使用is-open来实现它,但实际上我不知道如何使用它。

我刚才提到的功能:

$scope.addSportToLines = function(sportObj) {
  sportObj.shown = !sportObj.shown;
  var firstLeagues = _.first(sportObj.leagues);
  if (sportObj.shown || !firstLeagues) {
    loaderAlert.show();
    $scope.lineSport = sportObj;
    $scope.lineLeagues = [];
    $scope.deactivateLeagues();
    $scope.addLeagueToLines(firstLeagues);
  }else {
    $scope.defaultLines();
  }
};

这是手风琴的html:

    <accordion close-others="false">
      <accordion-group ng-repeat="sport in sports"
        ng-show="sport.leagues.length"
        ng-click="addSportToLines(sport);">
        <accordion-heading>
          <div>
            {{::sport.name}}
          </div>
        </accordion-heading>
        <div class="list-group">
          <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>
        </div>
      </accordion-group>

一个手风琴组可以有一个is-open表达式,像这样绑定

      <accordian-group  is-open="myvar">

在ng-click中,您可以检查该值是否设置为true,并且不执行您不希望执行的操作。 由于您似乎正在创建动态手风琴组,因此必须将“运动”的某些唯一标识符传递到is-open函数中,并为每个函数设置/检查该值。 像这样:

     <accordian-group is-open="accordianStatus[sport.name])">

     $scope.accordianStatus = {}; // Map of which sports are open

同样,当项目关闭时,必须将标志设置为false。 然后使用

     $scope.addSportToLines = function(sportObj) {
        if($scope.accordianStatus[sportObj.name]) {   // Already open check

        .......

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM