La función angular.bind() en AngularJS se usa para vincular el contexto actual a una función, pero en realidad lo ejecuta en un momento posterior. También se puede utilizar en Aplicaciones Parciales . Aplicaciones parciales es cuando quieres hacer una función pero algunos de los argumentos ya se han pasado.
Sintaxis:
angular.bind(self, function, args);
Valores paramétricos:
- self: Esto se refiere al contexto en el que la función debe ser evaluada.
- función: Se refiere a la función a enlazar.
- args: se utiliza para enlazar previamente a la función en el momento de la llamada a la función. Es un argumento opcional.
Ejemplo 1:
html
<html>
<head>
<title>angular.bind()</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js">
</script>
</head>
<body ng-app="app" style="text-align:Center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>angular.bind()</h2>
<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>
Salida:
Antes de Entrada:
Después de la entrada:
Ejemplo 2:
html
<html>
<head>
<title>angular.bind()</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js">
</script>
</head>
<body ng-app="app" style="text-align:Center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>angular.bind()</h2>
<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>
Salida:
Antes de Entrada:
Después de la entrada:
Publicación traducida automáticamente
Artículo escrito por Vishal Chaudhary 2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA