4 Example(s) of angular equal


Description :

angular.equal is used to compare between two int values whether these are same or not and the return value is true or false. See the code snippet:


angular equal Example - 1
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome in the AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
    <div ng-controller="equalsController">
        A<input type="number" ng-model="val1" ng-change="checkValue()" /><br />
        B<input type="number" ng-model="val2" ng-change="checkValue()" /><br />
        {{msg}}
    </div>
</body>
</html>
<script>
    var app = angular.module("app", []);
    app.controller('equalsController', ['$scope', function ($scope) {
        $scope.val1 = 2;
        $scope.val2 = 3;
        $scope.checkValue = function () {
            if (angular.equals($scope.val1, $scope.val2))
                $scope.msg = "Values are equal.";
            else
                $scope.msg = "Values are not equal.";
        }
    }]);

</script>

Output

Description :

In this example, we check if both checkbox have same value then it will return true otherwise it return false. See the code snippet:


angular equal Example - 2
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome in the AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
    <div ng-controller="equalsController">
        Licence <input type="checkbox" ng-model="a" ng-change="isEqual()" /><br />
        UID <input type="checkbox" ng-model="b" ng-change="isEqual()"><br />
        <p ng-show="aa">
            Both checkbox's have same value true or false.
        </p>
        <p ng-hide="aa">
            Any one checkbox have different value .
        </p>
    </div>
</body>
</html>
<script>
    var app = angular.module("app", []);
    app.controller('equalsController', ['$scope', function ($scope) {
        $scope.isEqual = function () {
            $scope.aa = angular.equals($scope.a, $scope.b);
        }
    }]);
   
</script>

Output

Description :

In the example, we have two drop-down list and both drop-down list bind with same object array, angular.equals check if both drop-down list have same selected item then it will return true otherwise false. and it will display different messages based on condition. See the code snippet:


angular equal Example - 3
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome in the AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
    <div ng-controller="equalsController">
        <select ng-model="studentId1" ng-options="student.name as student.name for student in students" ng-change="isEqual()"></select>
        <select ng-model="studentId2" ng-options="student.name as student.name for student in students" ng-change="isEqual()"></select>
        <br />
        {{msg}}
    </div>
</body>
</html>
<script>
    var app = angular.module("app", []);
    app.controller('equalsController', ['$scope', function ($scope) {
        $scope.students = [{ name: 'Herry', id: 1 }, { name: 'John', id: 2 }, { name: 'Peter', id: 3 }];
        $scope.isEqual = function () {
            $scope.msg = angular.equals($scope.studentId1, $scope.studentId2) == true ? "Selected item is same" : "Selected item is not same"
        }
    }]);
  
</script>

Output

Description :

angular.equal will check If Password field have same values then it will return true otherwise false. See the code snippet:


angular equal Example - 4
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome in the AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body ng-app="app">
    <div ng-controller="equalsController">
        Password: <input type="password" ng-model="pass" />
        Confirm  Password: <input type="password" ng-model="cofirmPass" ng-change="isPasswordMatched()" /><br />
        <p ng-show="isMatch" style="color:green">Password is matched</p>
        <p ng-hide="isMatch || cofirmPass==null" style="color:red">Password is not match</p>
    </div>
</body>
</html>
<script>
    var app = angular.module("app", []);
    app.controller('equalsController', ['$scope', function ($scope) {
        $scope.isPasswordMatched = function () {
            $scope.isMatch = angular.equals($scope.pass, $scope.cofirmPass);
        }
    }]);
   
</script>

Output