Skip to content
Related Articles

Related Articles

How to count array items in AngularJS ?

View Discussion
Improve Article
Save Article
Like Article
  • Last Updated : 05 Jun, 2022

Given an array and the task is to get the length of an array variable in AngularJS. For this, we will be using the .length() method to get the length of an array variable. 

Example 1: In this example, the array length is shown by the alert box.

HTML




<!DOCTYPE HTML>
<html>
 
<head>
    <script src=
    </script>
 
    <script>
        var myApp = angular.module("app", []);
        myApp.controller("controller", function ($scope) {
            $scope.arr = ['GFG', 'Geek',
                'Geeks', 'GeeksForGeeks'];
            $scope.length = '';
            $scope.getLen = function () {
                $scope.length = $scope.arr.length;
                alert("Array Length = " + $scope.length);
            };
        });
    </script>
</head>
 
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>
 
     
<p>
        How to count array items in AngularJS
    </p>
 
 
 
    <div ng-app="app">
        <div ng-controller="controller">
 
             
<p>Array = {{arr}}</p>
 
 
            <button ng-click="getLen()">
                Click To Get Length
            </button>
        </div>
    </div>
</body>
 
</html>


Output:

  • Before clicking the button:

  • After clicking the button:

Example 2: In this example, length is shown inside the <p>element.

HTML




<!DOCTYPE HTML>
<html>
 
<head>
    <script src=
    </script>
 
    <script>
        var myApp = angular.module("app", []);
        myApp.controller("controller", function ($scope) {
            $scope.arr = ['GFG', 'Geek',
                    'Geeks', 'GeeksForGeeks'];
            $scope.length = '';
            $scope.getLen = function () {
                $scope.length = $scope.arr.length;
            };
        });
    </script>
</head>
 
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>
 
 
     
<p>
        How to count array items in AngularJS
    </p>
 
 
 
    <div ng-app="app">
        <div ng-controller="controller">
 
             
<p>Array = {{arr}}</p>
 
 
            <button ng-click="getLen()">
                Click To Get Length
            </button>
 
             
<p>Length is = {{length}}</p>
 
 
        </div>
    </div>
</body>
 
</html>


Output:


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!