Angular-js

How to display number using ng-reapeat in Angular Js

How to display number using ng-reapeat in Angular Js, someone asked me to explain?
By:

Display number using ng-reapeat in Angular Js 

For this kind process you can use {{$index}} to print index position for Auto Numbering inside ng-repeat. 

<html>
<head>
    <script src="Scripts/angular.min.js"></script>
    <title></title>
    <script>
        var app = angular.module("app", []);
        app.controller("ctrl", function ($scope) {
            $scope.friends = [{ name: 'Nasrullah', gender: 'Male' },
            { name: 'Fathima', gender: 'female' },
            { name: 'Ishaq', gender: 'male' },
            { name: 'Rasik', gender: 'male' }];
        });
    </script>
</head>
<body ng-app="app">
    <div ng-controller="ctrl">
        <ul class="example-animate-container">
            <li ng-repeat="friend in friends">
                <div>
                    {{$index +1}}
  {{friend.name}} is a {{friend.gender}}.
 
                </div>
            </li>
        </ul>
    </div>
</body>
</html>

 display number using ng-reapeat in Angular Js

Description: 

In this above program Now I am going to display list of names using the variable {{$index +1}}

In this variable is used to Auto numbering of Angularjs ng-repeat.

In this same manner we can use below variables to make your project legible.

·                  $index

·                  $first

·                  $middle.

·                  $last

·                  $even

·                  $odd

 

 

Related Article

Post your comments / questions



Recent Article