La directiva ng-mousedown en AngularJS se usa para aplicar un comportamiento personalizado cuando ocurre un evento mousedown en un elemento HTML específico. Se puede usar para mostrar una alerta emergente cuando se presiona el botón del mouse. Es compatible con todos los elementos HTML.
Sintaxis:
<element ng-mousedown="expression"> Contents... </element>
Ejemplo 1: este ejemplo usa la directiva ng-mousedown para establecer el estilo del elemento después de hacer clic con el mouse.
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
<title>ng-mousedown Directive</title>
</head>
<body ng-app style="text-align:center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>ng-mousedown Directive</h2>
<div>
<p ng-mousedown="geek={'color':'green',
'font-size':'larger'}" ng-mouseup=
"geek={'font-size':''}" ng-style="geek"
ng-class="'button'">
Hold mouse click to see effect.
</p>
</div>
</body>
</html>
Salida:
Antes de hacer clic en el elemento: 
Después de hacer clic en el elemento:
Ejemplo 2: este ejemplo utiliza la directiva ng-mousedown para mostrar un mensaje de alerta después de hacer clic en el área de entrada.
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
<title>ng-mousedown Directive</title>
</head>
<body ng-app="app" style="text-align:center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>ng-mousedown Directive</h2>
<div ng-controller="app">
Input: <input type="text" ng-mousedown="alert()"
ng-model="click" />
</div>
<script>
var app = angular.module("app", []);
app.controller('app', ['$scope', function ($scope) {
$scope.click = 'geeksforgeeks';
$scope.alert = function () {
alert($scope.click);
}
}]);
</script>
</body>
</html>
Salida:
Antes de hacer clic en el texto de entrada: 
Después de hacer clic en el texto de 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