0

我正在使用 uib-accordion 指令，我想添加一个按钮来展开/关闭手风琴中的所有元素。我的代码是这样的：

<uib-accordion close-others="false">
    <div align="right">
      <a href="" ng-click="showFunc = !showFunc"> {{ showFunc ? "Hide all" : "Show all" }} </a>
    </div>
    <uib-accordion-group is-open="showFunc" ng-repeat="fun in functions" heading="{{ fun.name }}" is-disabled="!fun.show">
    </uib-accordion-group>

发生的情况是，当我单击展开所有按钮时，只要您不单独单击每个面板，就会在面板范围内创建变量 showFunc，并且 is-show 指令从那里获取它。

怎么可能做到？我正在使用角度 1.6.2

谢谢。

4

1 回答 1

0

我认为您在不同的上下文中混合了不同的变量（ngRepeat 的每次迭代都会创建一个不同的上下文，并且您错误地（？）为每个变量分配了一个不同的 showFunc 变量）并弄得一团糟。

您可以做的是为手风琴分配一个全局变量，在单击按钮时切换它，然后将所有is-open对象属性分配给该值，我将一个open属性绑定到每个对象，以便我可以轻松地遍历对象并访问它。

HTML

<div uib-accordion-group is-open="fun.open" ng-repeat="fun in funcs" class="panel-default"
     heading="{{ fun.name }}">
  {{fun.name}}
</div>

JS

$scope.allOpen = false; // all are closed

// call this function on button click
$scope.openAll = function() {
    $scope.allOpen = !$scope.allOpen; // toggle here 

    $scope.funcs.forEach((f) => {
        f.open = $scope.allOpen;
    });
};

为简单起见使用forEach

演示插件

于 2018-04-21T05:38:02.323 回答