让我们说，我收到一个对象字面量有15个对象，我需要显示他们在一个不错的布局(不是所有在一行)，什么是最有效的方法来控制何时应该断开/页面应该结束？
现在我在表行上使用ng-repeat，结果是一个包含一列的长表。
编辑澄清。可以有对象/更多的参数中的对象。这里是我的对象：
$scope.zones = [
{"name": "Zone 1","activity": "1"},{"name": "Zone 2",{"name": "Zone 3","activity": "0"},{"name": "Zone 4",{"name": "Zone 5",{"name": "Zone 6",{"name": "Zone 7",{"name": "Zone 8",{"name": "Zone 9",{"name": "Zone 10",{"name": "Zone 11",{"name": "Zone 12",{"name": "Zone 13",{"name": "Zone 14",{"name": "Zone 15",];
我将使用表和实现在控制器中的分页，以控制显示多少和按钮移动到下一页。
This Fiddle可能会帮助你。
原文链接：https://www.f2er.com/angularjs/145623.html<table class="table table-striped table-condensed table-hover">
<thead>
<tr>
<th class="id">Id <a ng-click="sort_by('id')"><i class="icon-sort"></i></a></th>
<th class="name">Name <a ng-click="sort_by('name')"><i class="icon-sort"></i></a></th>
<th class="description">Description <a ng-click="sort_by('description')"><i class="icon-sort"></i></a></th>
<th class="field3">Field 3 <a ng-click="sort_by('field3')"><i class="icon-sort"></i></a></th>
<th class="field4">Field 4 <a ng-click="sort_by('field4')"><i class="icon-sort"></i></a></th>
<th class="field5">Field 5 <a ng-click="sort_by('field5')"><i class="icon-sort"></i></a></th>
</tr>
</thead>
<tfoot>
<td colspan="6">
<div class="pagination pull-right">
<ul>
<li ng-class="{disabled: currentPage == 0}">
<a href ng-click="prevPage()">« Prev</a>
</li>
<li ng-repeat="n in range(pagedItems.length)"
ng-class="{active: n == currentPage}"
ng-click="setPage()">
<a href ng-bind="n + 1">1</a>
</li>
<li ng-class="{disabled: currentPage == pagedItems.length - 1}">
<a href ng-click="nextPage()">Next »</a>
</li>
</ul>
</div>
</td>
</tfoot>
<tbody>
<tr ng-repeat="item in pagedItems[currentPage] | orderBy:sortingOrder:reverse">
<td>{{item.id}}</td>
<td>{{item.name}}</td>
<td>{{item.description}}</td>
<td>{{item.field3}}</td>
<td>{{item.field4}}</td>
<td>{{item.field5}}</td>
</tr>
</tbody>
</table>
在fiddle示例中的$ scope.range应该是：
$scope.range = function (size,start,end) {
var ret = [];
console.log(size,end);
if (size < end) {
end = size;
if(size<$scope.gap){
start = 0;
}else{
start = size-$scope.gap;
}
}
for (var i = start; i < end; i++) {
ret.push(i);
}
console.log(ret);
return ret;
};
