auto increment field in bootstrap table using angular- meteor - angularjs

Question

I am building my first angular-meteor app.
Find below the app.js file:
libri = new Mongo.Collection("libri");
if (Meteor.isClient) {
angular.module('bookshelf',['angular-meteor']);
angular.module('bookshelf').controller('BookListCtrl', ['$scope','$meteor',
function($scope,$meteor){
$scope.libri = $meteor.collection(libri)
$scope.counter = 0;
for(i = 0; i < libri.find().count(); i++){
$scope.counter += 1;
}
}]);
}
if (Meteor.isServer) {
Meteor.startup(function () {
});
}
and the index.ng.html file:
<div class="container">
<table class="table" ng-controller="BookListCtrl">
<caption>Optional table caption.</caption>
<thead>
<tr>
<th>Contatore</th>
<th>Titolo</th>
<th>Autore</th>
<th>Casa Editrice</th>
</tr>
</thead>
<tbody ng-repeat="libro in libri">
<tr>
<td>{{counter}}</td>
<td>{{libro.titolo}}</td>
<td>{{libro.autore}}</td>
<td>{{libro.casaEditrice}}</td>
</tr>
</tbody>
</table>
</div>
And I get the following table:
As you can see the auto increment field {counter} is always 3. I would like to be 1,2,3 for each line of the table without creating another document-field in the collection ('libri'). That cell of the table is not part of the mongo collection.
Is there any suggestion? Why I cannot print the loop in the html table? Thanks

Answer 1

The reason why you are always getting only number 3 is because that is what is being prepared for the view.
When the view gets the data front the controller, the counter is already at the value 3.
What you should do is use $index instead of {{counter}} and it will automatically get the index from the ng-repeat iterating over the array, so you will get 1, 2, 3....
If you wanted to send it with your data from the controller, then you should imbue the index with your array.
Something like this:
var tempArr = [
{name: 'a'},
{name: 'b'},
{name: 'c'}
]
var i = 0;
for (; i < tempArr.length; i++) {
tempArr[i].index = i;
}
console.log('updated array', tempArr);
Just replace tempArr with your data, and it should run smoothly.
You can test this here, just check your console.
Hope this helps :)

Answer 2

Use {{$index}} instead of {{counter}}.