Question

我从服务中获取数据，因此手风琴的数量将是可变的。我用ng-repeat来动态显示手风琴

<div ng-controller = "groupController">

<div ng-repeat = "groups in groupNames">
    <div class = "panel-group" id = "accordion">
    <div class = "panel panel-default">
        <div class="panel-heading">
        <div class = "panel-title">
            <a data-toggle= "collapse" data-parent="#accordion" href="#collapse{{$index}}"> {{groups.team}} </a>
        </div>
        </div>

        <div id="collapse{{$index}}" class = "panel-collapse collapse">
        <div class = "panel-body">
            <!-- display some data in the panel body -->
        </div>
        </div>
     </div>
     </div>
</div>

<button class = "btn btn-primary">collapseAll</button>
<button class = "btn btn-primary">expandAll</button>

</div>

如何使用控制器实现全部折叠并展开全部。我发现的答案主要解决了ui-bootstrap提供的手风琴。特别是我如何操纵angularjs中的hrefs来全部折叠并展开全部？

Answer 1

首先，您应该记得为close-others=false设置accordion，因为在ui-bootstrap默认情况下它是close-others=true，这意味着您只能在时间。

然后，您可以通过将is-open绑定到控制器中的某个变量来控制accordion-group的{{1}}属性。然后将按钮链接到控制器中的某个功能，将所有这些变量设置为true或false。

Here是Plunker的一个例子。

angularjs扩展ng-repeat内的所有手风琴

1 个答案: