Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App
geeksforgeeks
Browser
Continue

Related Articles

AngularJS angular.bind() Function

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

The angular.bind() Function in AngularJS is used to bind the current context to a function, but actually, execute it at a later time. It can also be used in Partial Applications. Partial Application is when you want to make a function but some of the arguments have been passed already.

Syntax:

angular.bind(self, function, args);

Parameter Values:

  • self: This refers to the context in which the function should be evaluated.
  • function: It refers to the function to be bound.
  • args: It is used to prebound to the function at the time of the function call. It is an optional argument.

Example 1: This example describes the implementation of the angular.bind() Function in AngularJS.

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>angular.bind()</title>
    <script src=
    </script>
</head>
 
<body ng-app="app" style="text-align:Center">
    <h1 style="color:green">GeeksforGeeks</h1>
    <h3>angular.bind()</h3>
    <p>Input number to sum with 5:
    <div ng-controller="geek">
        <input type="number" ng-model="num" ng-change="Func()" />
        <br>Sum = {{Add}}
    </div>
 
    <script>
        var app = angular.module("app", []);
        app.controller('geek', ['$scope', function ($scope) {
            $scope.num = 0;
            $scope.Func = function () {
                var add = angular.bind(this, function (a, b) {
                    return a + b;
                });
                $scope.Add = add(5, $scope.num);
            }
        }]);
 
    </script>
</body>
</html>

Output:

 

Example 2: This is another example that describes the implementation of the angular.bind() Function in AngularJS.

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>angular.bind()</title>
    <script src=
    </script>
</head>
 
<body ng-app="app" style="text-align:Center">
    <h1 style="color:green">GeeksforGeeks</h1>
    <h3>angular.bind()</h3>
    <div ng-controller="geek">
        Input A:
        <input type="number"
               ng-model="val1"
               ng-change="GetResult()" />
        <br><br>
        Input B:
        <input type="number"
               ng-model="val2"
               ng-change="GetResult()" />
        <br /><br>
        {{result}}
    </div>
 
    <script>
        var app = angular.module("app", []);
        app.controller('geek', ['$scope', function ($scope) {
            function isEqual(a, b) {
                if (a == b) {
                    return "Inputs are equal."
                }
                else if (a >= b) {
                    return "A is greater than B."
                }
                else if (a <= b) {
                    return "A is lesser than B."
                }
            }
            $scope.GetResult = function () {
                var result = angular.bind(this, isEqual);
                $scope.result = result($scope.val1, $scope.val2);
            }
        }]);
    </script>
</body>
</html>

Output:

 


My Personal Notes arrow_drop_up
Last Updated : 12 Sep, 2022
Like Article
Save Article
Similar Reads
Related Tutorials