我如何使用AngularJS ng-repeat显示以下HTML(Twitter Bootstrap Scaffolding)?基本上,我需要关闭< / div>,打印一个< hr>,然后打开另一个< div class =“span4”>
<div class="row"> <div class="span4"> <h3> Project A </h3> </div> <div class="span4"> <h3> Project B </h3> </div> <div class="span4"> <h3> Project C </h3> </div> </div> <hr> <div class="row"> <div class="span4"> <h3> Project D </h3> </div> <div class="span4"> <h3> Lab Title </h3> </div> <div class="span4"> <h3> Project E </h3> </div> </div>
我为代码演示创建了一个小提琴。
http://jsfiddle.net/ADukg/261/
解决方法
一个更优雅的方法是使用视图模型提供一个分块集合,然后让视图处理它
<div ng-controller="Controller"> Projects <input ng-model="projects"></input> <hr/> <div ng-repeat="row in rows"> <div ng-repeat="project in row"> Projects {{project}} </div> <hr/> </div> </div>
和coffeescript很简单
# Break up an array into even sized chunks. chunk = (a,s)-> if a.length == 0 [] else ( a[i..i+s-1] for i in [0..a.length - 1 ] by s) @Controller = ($scope)-> $scope.projects = "ABCDEF" $scope.$watch "projects",-> $scope.rows = chunk $scope.projects.split(""),3 angular.bootstrap(document,[]);
原文地址:https://www.jb51.cc/bootstrap/234489.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。