Est-il possible d'écouter de la flèche keyspress à l'aide de ng-pression de touche?

Je suis en train de créer une interaction similaire pour le konami code "haut,haut,bas,bas,a,b,a,b, entrez" -> il se passe quelque chose.

Est-il possible d'écouter de la flèche keyspress à l'aide de ng-pression de touche? il semble ne pas fonctionner?

html:

input( ng-keypress='changed($event)'  )

Js

$scope.changed = (evt) ->
    console.log(evt)

ce ne sera pas déconnecter la touche flèche événements?

Dois-je déployer mes propres auditeurs sur la fenêtre? si oui, comment puis-je atteindre cet angulaire?

j'ai créé démo et sa fonctionne très bien.
je suis en train d'essayer de détecter les touches fléchées. il fonctionne bien, mais comment voulez-vous détecter quand quelqu'un pousse la flèche vers le haut dans le champ de saisie

OriginalL'auteur Matthew Harwood | 2014-08-23

  1. 21

    DÉMO 

    $scope.key = function($event){
    console.log($event.keyCode);
    if ($event.keyCode == 38)
        alert("up arrow");
    else if ($event.keyCode == 39)
        alert("right arrow");
    else if ($event.keyCode == 40)
        alert("down arrow");
    else if ($event.keyCode == 37)
        alert("left arrow");
}

    MODIFIER

    Changement de ng-keypress à ng-keydown. DÉMO

    <input ng-keydown="key($event)" />
    Il est intéressant de noter que je reçois pas les alertes lors de l'utilisation de google chrome? il fonctionne sur firefox lol?
    sera correcte, quels que soient mais savez-vous comment faire les codes de touche de la croix-navigateur?
    J'ai testé sur firefox alors laissez-moi essayer sur chrome.
    Vérifier mes mises à jour de réponse.
    Salut, aucune idée de pourquoi j'obtiens des valeurs erronées dans mon code 🙁 stackoverflow.com/questions/30128431/...

    OriginalL'auteur Darshan P

  2. 1

    Vous pouvez utiliser un custom directive pour écouter keydown et keypressed événements. Une mise en œuvre possible que j'ai testé est le suivant:

    var app = angular.module('app', []);
//a helper service to detect the arrow keys from the key codes
app.factory('keys', function() {
var keysEnum = { left: 37, up: 38, right: 39, down: 40 };
var theKeys =  [ keysEnum.left, keysEnum.up, keysEnum.right, keysEnum.down ];
function isIn(val) {
var isin = false
if (theKeys.indexOf(val) >= 0) {
isin = true;
}
return isin;
}
function keyFromCode(code) {
var key = 'unknown';
switch (code) {
case 37:
key = 'left';
break;
case 38:
key = 'up';
break;
case 39:
key = 'right';
break;
case 40:
key = 'down';
break;
}
return key;
}
return {
isIn: isIn,
keyFromCode: keyFromCode
};
});
//custom directive to detect the arrow key pressed
app.directive('keypressed', [ 'keys', function (keys) {
return function (scope, element, attrs) {
//listen for the events keydown, keypress
element.bind("keydown keypress", function (event) {
var code = event.which;
//if an arrow key is pressed then do something
if(keys.isIn(code)) {
console.log(keys.keyFromCode(code));
}
});
};
}]);

    Vous pouvez utiliser la directive ci-dessus comme ceci:

    <span ng-app="app">
<input keypressed />
</span>

    À partir du code que vous avez posté, il semble que vous utilisez un moteur de template html, donc dans votre cas vous pouvez utiliser la directive comme ceci:

    input( keypressed )

    OriginalL'auteur Panos Matzavinos