AngularJS digits in $index

Question

Say for example I have the following code (pseudo):

<div ng-repeat=range>{{ $index }}</div>

The result would be

1 2 3 4 5 6 ...

How could I go about changing the code above so that the indexes are printed

001 002 003 004 005 006? (so that the index is printed as 3 digits)

possible duplicate of How to output integers with leading zeros in JavaScript — Nick Andriopoulos
– Nick Andriopoulos, Commented Jun 2, 2013 at 9:43
@hexblot The possible duplicate you linked to itself seems itself to have been previously marked as a duplicate of another question... — Neil
– Neil, Commented Jun 2, 2013 at 10:22
@hexblot Creating an AngularJS filter was the big key to answering this question. I don't think this should be considered as a duplicate to the question linked. — dk123
– dk123, Commented Jun 2, 2013 at 16:12

Michelle Tilley · Accepted Answer · 2013-06-02 07:43:43Z

2

You could do this pretty easily with a filter.

First, define it like so:

myModule.filter("tripleDigit", function() {
  return function(number) {
    if (number !== null && number !== undefined) {
      var str = "" + number;
      while (str.length < 3) str = "0" + str;
      return str;
    }
  };
});

Then you can pipe $index into it:

<div ng-repeat=range>{{ $index | tripleDigit }}</div>

Here's an example that defines a filter called pad that allows you to pass in how many digits to pad as an argument: http://jsfiddle.net/BinaryMuse/64ycY/

answered Jun 2, 2013 at 7:43

Michelle Tilley

159k40 gold badges379 silver badges312 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

dk123 Over a year ago

Nice answer. I was never too sure how to go about implementing filters and the fiddle example has also taught me just how. Thanks!

Collectives™ on Stack Overflow

AngularJS digits in $index

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related