angularjs – angular-ui-bootstrap手风琴折叠/展开全部
发布时间:2020-12-17 10:16:17 所属栏目:安全 来源:网络整理
导读:我想为一组手风琴创建一个collpase / expand all按钮.我正在使用angular.js v1.2.6和angular-bootstrap-ui 0.9.0.我无法找到如何进行collpase / expand all的示例.我是一个有角度的新手,任何建议或意见表示赞赏. 另外,我应该补充一点,this post中的解决方案
我想为一组手风琴创建一个collpase / expand all按钮.我正在使用angular.js v1.2.6和angular-bootstrap-ui 0.9.0.我无法找到如何进行collpase / expand all的示例.我是一个有角度的新手,任何建议或意见表示赞赏.
另外,我应该补充一点,this post中的解决方案在我使用的较新版本的angular.js(v1.0.8 vs v1.2.6)中不起作用(这是此发布时的最新版本).在较新的版本中,它会抛出有关尝试创建两个隔离范围的错误. 标记: <div ng-controller="myCtlr"> <accordion close-others="oneAtATime"> <button class="btn" ng-click="section.isCollapsed = !section.isCollapsed">Toggle Sections</button> <accordion-group ng-repeat="section in sections" is-open="section.isOpen"> <accordion-heading> <div class="accordion-heading-content" ng:class="{collapsed: section.isOpen}"> {{section.name}} </div> </accordion-heading> Section content </accordion-group> </accordion> </div> JS: var theapp = angular.module('myApp',[ 'ui.bootstrap' ]) function myCtlr ($scope) { $scope.isCollapsed = false; $scope.sections = [ {'id': '353','otherid': '7','name': 'One','Sequence': '1'},{'id': '354','otherid': '8','name': 'Two',{'id': '355','otherid': '9','name': 'Three','Sequence': '1'} ]; }
这是一个使用is-open属性的方法.
http://plnkr.co/edit/MliW41xGJAF0Mnw4Rgu7?p=preview (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
相关内容
- 使用Bootstrap3和Ladda UI实现的多种按钮“加载中”效果体验
- 我可以使用CoffeeScript编写我的Electron(Atom Shell)应用程
- 《数据结构》第三章 栈和队列学习指南
- node.js-docker swarm服务中的Nodejs应用程序,更新无效
- .NET Custom Attribute Learning and Practice
- 角度 – 当购物车中的产品数量增加时,总价格不会更新在Ioni
- webService----wss4j+cxf实现WS-Security(基于UsernameToke
- angularjs和angular-cookies 设置cookie的过期时间
- Shell脚本做程序监控
- scala – 只要演员被放入路由器就会遇到“死信”