CODEWITHSUNDEEP
javascripthtmlangularjsjson
Mark
Mark

Reputation: 1872

Add a counter to Angular ng-repeat?

I am trying to find some documentation for being able to append a counted number to each item returned by an ng-repeat. Is this not an out of a box thing for Angular? Not quite like an Id, but more like, if 4 items returned, each item JSON object could add a number in front of data returned. My code looks like:

<div  class="swipeBoxes" ng-repeat="swipe in swipes">
    <a href="#">
        <div class="swipeBox">
            <span class="swipeNum"></span>
            <p><span>swipe date:</span><span>{{ swipe.date | date: 'MM/dd/yyyy'}}</span></p>
            <p><span>provider:</span><span>{{ swipe.merchant }}</span></p>
            <p><span>amount:</span><span>{{ swipe.amount | currency }}</span></p>
        </div>
    </a>
</div>

Upvotes: 2

Views: 3277

Answers (2)

George Netu
George Netu

Reputation: 2832

Using $index from ngRepeat should be able to solve your problems.

Upvotes: 2

Deblaton Jean-Philippe
Deblaton Jean-Philippe

Reputation: 11388

You can use $index for your counter.

<div  class="swipeBoxes" ng-repeat="swipe in swipes">
    {{$index + 1}}
</div>

Upvotes: 7

Related Questions