Displaying records number in AngularJS - angularjs

Question

I want to display number of records of AngularJS , sample "1 to 10 of 15 records". Everything is working and I want to apply the page number. I'm using dir-paginate AngularJS , Is there easy way to achieve this? really appreciate your help. Here is my code:
HTML CODE:
<table class="primary-table">
<thead>
<tr>
<th>Username</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Contact Number</th>
<th>Address</th>
<th>Position</th>
<th>Status</th>
<th>Date Added</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody class="tbodyrow">
<tr ng-if="members.length==0"><td colspan="11">No Records</td></tr>
<tr ng-if="members.length>0" dir-paginate="member in members|orderBy:sortKey:reverse|filter:search|itemsPerPage:5">
<td>{{ member.username }}</td>
<td>{{ member.first_name }}</td>
<td>{{ member.last_name }}</td>
<td>{{ member.email }}</td>
<td>{{ member.contact }}</td>
<td>{{ member.address }}</td>
<td>{{ member.position }}</td>
<td>{{ member.status }}</td>
<td>{{ member.dateadded }}</td>
<td>Edit</td>
<td>Delete</td>
</tr>
</tbody>
<tfoot class="tfootrow">
<tr>
<td colspan="11">
<div class="grid2">
<div><!--number of records info here--></div>
<div>
<dir-pagination-controls max-size="5"
direction-links="true" boundary-links="true" >
</dir-pagination-controls>
</div>
</div>
</td>
</tr>
</tfoot>
</table>
JS CODE:
angular.module('app', ['angularUtils.directives.dirPagination']);
angular.module('app').controller('AdminController', function($scope, $http){
this.fetch = function(){
$http.get("../Ajax/Administrator/fetch.php").then(function (response) {
$scope.members = response.data;
});
}
});

Answer 1

Since you already know the page size you can use a model variable to assign the value and access the total lentgh of the array using array.length
<h3> 1 to {{ pageSize }} of {{members.length}} records</h3>
DEMO USING PLUNKER