[英]Expand / Collapse all function with AngularJS accordion
I am using the Angular UI accordion and I am trying to add a toggle button that will expand and collapse the panels. 我正在使用Angular UI手风琴,并且试图添加一个切换按钮来展开和折叠面板。 At present the panels will only open when a user clicks on the heading.
目前,面板仅在用户单击标题时打开。 The button I added toggles a variable 'isopen' to true or false but it does not seem to work.
我添加的按钮将变量“ isopen”切换为true或false,但似乎不起作用。
Here is my code: 这是我的代码:
<button ng-click="isopen =!isopen">expand/collapse</button> {{isopen}}
<accordion close-others="false">
<accordion-group is-open="isopen" ng-repeat="site in groups">
<accordion-heading ng-click="isopen = !isopen">
hey {{isopen}}
</accordion-heading>
hello
</accordion-group>
</accordion>
And here is a plunker: 这是一个矮人:
http://plnkr.co/edit/8AkWUxzOir5NNoA0fT5R?p=preview http://plnkr.co/edit/8AkWUxzOir5NNoA0fT5R?p=preview
When a user clicks on a panel header it should open that panel only. 用户单击面板标题时,应仅打开该面板。 The Toggle button will hopefully expand and collapse them all.
切换按钮有望将它们全部展开和折叠。
Your $scope
changes inside accordion. 您的
$scope
在手风琴内部发生变化。 Solution is attach this property in an object on $scope. 解决方案是将此属性附加到$ scope的对象中。
See working fiddle here . 在这里查看工作小提琴。
Updated plunkr . 更新了plunkr 。 It's not much difficult once you find out your mistake in previous question.
一旦发现上一个问题中的错误,这并不困难。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.