Angulaire - Existe-t-il une liste d'événements HostListener?

Question

Je suis à l'aide d'un hostlistener dans une directive pour détecter le "flou" et "keyup"-événements. Maintenant, j'ai besoin de détecter les changements dans l'entrée de l'élément de la directive se trouve sur. J'ai essayé

@HostListener('change', ['$event'])

mais il ne se déclenche pas.

Est-il un "changement"de l'événement? J'ai aussi lu qu'il devrait y avoir une "entrée"-événement, mais qui n'a pas le feu non plus.

Donc, ma question est: Est-il une liste des événements que je peux utiliser?

J'ai cherché sur google:

https://www.google.de/search?q=angular+2+liste+de+hostlistener+événements

et l'angulaire de la documentation:

https://angular.io/api/core/HostListener

mais ne pas trouver quelque chose.

Answer 1

Ouvrir angulaire de l'élément dom schéma https://github.com/angular/angular/blob/master/packages/compiler/src/schema/dom_element_schema_registry.ts#L78

où:

• (aucun préfixe): la propriété est une chaîne de caractères.
• *: propriété représente un événement.
• !: la propriété est une valeur de type boolean.
• #: la propriété est un nombre.
• %: la propriété est un objet.

Appuyez sur ctrl+F et écrire *

@HostListener(et aussi (customEvent)="handler()") est également possible d'écouter les événements personnalisés

Exemple

Answer 2

La liste des événements que vous pouvez écouter se trouve ici

https://www.w3schools.com/jsref/dom_obj_event.asp

et je crois que celui-ci est le même, mais mieux organisé (je ne sais pas si tous sont valides)

https://developer.mozilla.org/en-US/docs/Web/Events

Answer 3

Désolé, je pense que vous demandez une liste de propriétés. Vous pouvez utiliser par exemple

 @HostListener("focus", ["$event.target"])
  onFocus(target) {
    console.log(target.value)
  }

  @HostListener("blur", ["$event.target"])
  onBlur(target) {
    console.log(target.value)

  }
  @HostListener("input", ["$event.target.value"])
  onInput(value) {
    console.log(value)

  }
 

Answer 4

Je voulais une réponse montrant tous ceux comme ceci:
document:keydown.escape

dans le cadre de ce type de fragment dans Angulaire:

import { HostListener}    from '@angular/core';
@HostListener('document:keydown.escape', ['$event']) 
  onKeydownHandler(event: KeyboardEvent) {

  }

1. Ce site web a donné quelques exemples.
2. Ici est une liste plus complète.
3. Ici est un plus générique aperçu des solutions de rechange.

Answer 5

L'événement change est appliqué aux sélections .

Si vous avez essayé avec l'événement input et que cela ne fonctionne toujours pas, alors votre directive est le problème.

L'avez-vous importé / exporté? Avez-vous des erreurs de console? Un autre événement est-il tiré de votre directive?