Comment détecter les touches pressées sur le clic sur AngularJS

Je suis en utilisant angularjs sur une webapplication que j'ai besoin de savoir comment puis-je détecter est les touches ctrl, shift ou alt enfoncées lorsque je clique sur certains où les.

par exemple, avec jquery je peux le faire en accédant à la Sur des arguments de la fonction.

Est-il un out-of-the-box de façon à obtenir des informations sur angulaire?

InformationsquelleAutor Flavio Oliveira | 2014-05-14

Prendre un coup d'oeil à cette belle Choses concernant AngularJS gestion des clés

Sorte de code de touche pour la touche Ctrl, maj, alt seront

Ctrl - 17

Alt - 18

Maj - 16

Travail De Démonstration

HTML

<!DOCTYPE html>
<html>
<head>
  <script src="angular.js"></script>
  <script src="script.js"></script>
</head>

<body ng-app="mainModule">
  <div ng-controller="mainController">
    <label>Type something:
      <input type="text"
             ng-keydown="onKeyDown($event)"
             ng-keyup="onKeyUp($event)"
             ng-keypress="onKeyPress($event)" />
    </label><br />
    <strong>KEY DOWN RESULT:</strong> {{onKeyDownResult}}<br />
    <strong>KEY UP RESULT:</strong> {{onKeyUpResult}}<br />
    <strong>KEY PRESS RESULT:</strong> {{onKeyPressResult}}
  </div>
</body>
</html>

SCRIPT

angular.module("mainModule", [])
  .controller("mainController", function ($scope)
  {
    //Initialization
    $scope.onKeyDownResult = "";
    $scope.onKeyUpResult = "";
    $scope.onKeyPressResult = "";

    //Utility functions

    var getKeyboardEventResult = function (keyEvent, keyEventDesc)
    {
      return keyEventDesc + " (keyCode: " + (window.event ? keyEvent.keyCode : keyEvent.which) + ")";
    };

    //Event handlers
    $scope.onKeyDown = function ($event) {
      $scope.onKeyDownResult = getKeyboardEventResult($event, "Key down");
    };

    $scope.onKeyUp = function ($event) {
      $scope.onKeyUpResult = getKeyboardEventResult($event, "Key up");
    };

    $scope.onKeyPress = function ($event) {
      $scope.onKeyPressResult = getKeyboardEventResult($event, "Key press");
    };
  });

Parfait, qu'il, fonctionne parfaitement, juste ajouter $de l'événement. Merci

InformationsquelleAutor Nidhish Krishnan

31

Dans votre code html
```
<button ng-click="doSomething($event)"></button>
```
Dans votre js
```
$scope.doSomething = function($event)
{
if ($event.altKey){}
if ($event.ctrlKey){}
if ($event.shiftKey){}
}
```
- Beaucoup plus simple que toutes les autres solutions. A parfaitement fonctionné quand j'ai eu besoin de vérifier la touche Ctrl
- Remarque: ctrlKey ne fonctionnera pas comme prévu sur mac, comme cela déclenche un menu contextuel. Mac utilise la touche de commande pour cette.
- comment détecter la touche de commande, puis. pouvez-vous poster un extrait de code ou quelque chose. merci
- Je n'ai pas le code que j'ai utilisé pour le moment. Peut-être ici?: stackoverflow.com/questions/3902635/...
- Très bon!!! Ce doit être la accepté de répondre.
- Peut-on le faire avec ng-changer, mon ng-changement de la détection d'un changement, mais avec qui je veux vérifier si le ng-le changement est déclenchée avec la touche ctrl cliqué, alors que je peux l'ouvrir dans un nouvel onglet.
InformationsquelleAutor Flavien Volken
6

Si vous essayez de capturer une combinaison de touches, telles que Ctrl-Enter, vous pouvez regarder à la fenêtre de l'objet

Pour trouver par exemple Ctrl-Enter utilisez
```
if(window.event.keyCode == 13 && window.event.ctrlKey == true)
```
- Angulaire vous devez utiliser $event au lieu de window.event.
InformationsquelleAutor Victor Grazi

Il n'est pas "automatique" de façon à l'aide de pure JS, mais c'est relativement simple à suivre touches de modification de l'état dans des variables globales. E. g.

window.ctrlDown = false;

document.addEventListener('keydown', function(evt) {
  var e = window.event || evt;
  var key = e.which || e.keyCode;
  if(17 == key) {
    window.ctrlDown = true;
  }
}, false);

document.addEventListener('keyup', function(evt) {
  var e = window.event || evt;
  var key = e.which || e.keyCode;
  if(17 == key) {
    window.ctrlDown = false;
  }
}, false);

InformationsquelleAutor marekful

Puisque je ne suis pas sûr de ce que chaque navigateur, je voudrais faire de cette façon:

shiftPressed = event.shiftKey || (event.keyCode === 16);

Sur Chorme par exemple je ne peux pas voir tout les cas.mot de code sur l'événement click:

altKey: false
bubbles: true
button: 0
buttons: 0
cancelBubble: false
cancelable: true
clientX: 753
clientY: 193
ctrlKey: false
currentTarget: null
defaultPrevented: false
detail: 1
eventPhase: 0
fromElement: null
isDefaultPrevented: ()
isImmediatePropagationStopped: ()
isTrusted: true
isTrusted: true
layerX: 4
layerY: -15
metaKey: false
movementX: 0
movementY: 0
offsetX: 4
offsetY: -15
pageX: 1381
pageY: 193
path: Array[16]
relatedTarget: null
returnValue: true
screenX: 753
screenY: 278
shiftKey: true
srcElement: span.glyphicon.glyphicon-plus
stopImmediatePropagation: ()
target: span.glyphicon.glyphicon-plus
timeStamp: 1445613423528
toElement: span.glyphicon.glyphicon-plus
type: "click"
view: Window
webkitMovementX: 0
webkitMovementY: 0
which: 1
x: 753
y: 193

InformationsquelleAutor Danielo515

Vous devez vous connecter pour publier un commentaire.