La directiva ng-click en AngluarJS se usa para aplicar un comportamiento personalizado cuando se hace clic en un elemento. Se puede usar para mostrar/ocultar algún elemento o puede mostrar una alerta emergente cuando se hace clic en el botón. La directiva ng-click es una herramienta muy útil utilizada en AngularJS. Cuando se hace clic en un HTML, la directiva ng-click le dice al script AngularJS qué hacer.
En este artículo, aprenderemos cómo obtener muchas/múltiples funciones para la directiva ng-click aprobada, con solo un clic.
Sintaxis:
<element ng-click="expression1(), expression2(), expression3()"> </element>
La clave es agregar un punto y coma (;) o una coma (,). Todas las funciones deben estar separadas por un (;) o un (, ). Esta sintaxis es compatible con todos los elementos del HTML. Básicamente es una expresión que, cuando se hace clic, se ejecuta.
Ejemplo: este ejemplo muestra cómo agregar más de una función con un solo clic.
<!DOCTYPE html> <html> <head> <title> How to add many functions in one ng-click? </title> <script src= "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"> </script> <body ng-app="myApp"> <h1 style = "color:green;" > GeeksforGeeks </h1> <strong> How to add many functions in one ng-click? </strong> <div ng-controller="myCtrl"> <p>Please click the below button to see the working:</p> <!-- To write multiple functions - write the functions and separate them by the semicolon (;) --> <button ng-click="myFunc(); popper();"> Click Here! </button> <p>The button has been clicked {{count}} times.</p> </div> <script> angular.module('myApp', []) .controller('myCtrl', ['$scope', function($scope) { $scope.count = 0; // first function $scope.myFunc = function() { $scope.count++; // Second function $scope.popper = function() { alert('GeeksforGeeks! Click again to increase count'); }; }; }]); </script> </body> </html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por SohomPramanick y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA