dirpagination有效,因为它每行提供10个项目,但我无法看到表格底部的控件进行导航。
//创建标签和表格
<div ng-controller="MyController" class="my-controller">
<div class="container">
<h2>Legislaotrs</h2>
<ul class="nav nav-tabs">
<li><a href="#" class="active">By State</a></li>
<li><a href="#">House</a></li>
<li><a href="#">Senate</a></li></ul>
</div>
<form class="form-inline">
<div class="form-group">
<label >Search</label>
<input type="text" ng-model="search" class="form-control" placeholder="Search">
</div>
</form>
<table class="table table-striped table-hover">
<thead>
<tr>
<th>Party</th>
<th>Name</th>
<th>Chamber</th>
<th>District</th>
<th>State</th>
</tr>
</thead>
<tbody>
<tr dir-paginate="user in users|filter:search|itemsPerPage:10">
<td> <img src="{{user.party_name}}" style="max-height: 10%;max-width: 10%;"/> </td>
<td>{{user.fullname}}</td>
<td > <img src="{{user.chamber_type}}" style="max-height: 8%;max-width: 7%;"/>{{user.chamber_name}} </td>
<td>{{user.district_name}}</td>
<td>{{user.state_name}}</td>
<td> <button type="button" class="btn btn-primary">View Details</button></td>
</tr>
</tbody>
</table>
//设置分页控件
<div id="paginate">
<dir-pagination-controls
max-size="5"
direction-links="true"
boundary-links="true">
</dir-pagination-controls></div>
</div>
答案 0 :(得分:0)
首先,您需要在项目中包含该模块:
angular.module('myApp', ['angularUtils.directives.dirPagination']);
然后创建分页内容:
<dir-pagination-controls
[max-size=""]
[direction-links=""]
[boundary-links=""]
[on-page-change=""]
[pagination-id=""]
[template-url=""]>
</dir-pagination-controls>
此处正在运作plunker