$index of Object in Array while using ng-repeat and a filter

Unfortunately $index is only the "iterator offset of the repeated element (0..length-1)"

If you want the original index you would have to add that to your collection before filtering, or simply not filter the elements at all.

One possible approach:

angular.forEach(members, function(member, index){
   //Just add the index to your item
   member.index = index;
});

<div ng-repeat="member in members">
   <a href="/profiles/{{member.index}}">
</div>

Now, it also seems that this kind of information is really more like an ID than anything else. Hopefully that is already part of the record, and you can bind to that instead of using the index.


You could use a function to return the index from the array

<div ng-repeat="post in posts | orderBy: '-upvotes'">
   <a href="#/posts/{{getPostIndex(post)}}"></a> 
</div>

And the function

$scope.getPostIndex = function (post) {
    return $scope.posts.indexOf(post); //this will return the index from the array
}

On my example I have an array of objects called "posts", on which I use a filter to order them by one of their properties ("upvotes" property). Then, in the "href" attribute I call "getPostIndex" function by passing it by reference, the current object.

The getPostIndex() function simply returns the index from the array by using Javascript array indexOf() method.

The nice thing about this is that this solution is not tied to a specific filter (like in @holographix answer) and will work for all of them.


I just stumbled across the same problem and I found this supertrick on the angular git issues

items.length - $index - 1

like

    <div ng-repeat="item in ['item', 'item', 'item'] | reversed">
      <!-- Original index: 2, New index: 0 -->
      <p>Original index: {{items.length - $index - 1}}, New index: {{$index}}</p>
      <!-- Original index: 1, New index: 1 -->
      <p>Original index: {{items.length - $index - 1}}, New index: {{$index}}</p>
      <!-- Original index: 0, New index: 2 -->
      <p>Original index: {{items.length - $index - 1}}, New index: {{$index}}</p>
    </div>

if you're in trouble like me give it a shot:

https://github.com/angular/angular.js/issues/4268


Try this :

<div ng-repeat="member in members">
{{members.indexOf(member)}}
</div>

indexOf always returns the original index in an ng-repeat

Demo