Dans angular2, la touche enter déclenche-t-elle un événement de clic sur la page?

Dans le code ci-dessous, removeSelectedCountry() doit être appelé lorsque l’utilisateur clique sur l’élément span et que handleKeyDown($event) doit être appelé lorsqu’il existe un événement keydown sur le div.

 @Component({ selector: "wng-country-picker", template: `  0">   {{ country.name }}  
 
 
 `, providers: [CUSTOM_VALUE_ACCESSOR] })

Mais removeSelectedCountry() est appelée chaque fois que vous appuyez sur la touche Entrée.

Pour que le code fonctionne, je devais changer l’événement click en événement mousedown . Cela fonctionne bien maintenant.

Quelqu’un peut-il expliquer pourquoi enter key déclencherait un événement clic?

 @Component({ selector: "wng-country-picker", template: `  0">   {{ country.name }}  
 
 
 `, providers: [CUSTOM_VALUE_ACCESSOR] })

Ajout d’un extrait de classe

 export class CountryPickerComponent { private selectedCounsortinges: CountrySummary[] = new Array(); private removeSelectedCountry(country: CountrySummary){ // check if the country exists and remove from selectedCounsortinges if (this.selectedCounsortinges.filter(ctry => ctry.code === country.code).length > 0) { var index = this.selectedCounsortinges.indexOf(country); this.selectedCounsortinges.splice(index, 1); this.selectedCountryCodes.splice(index, 1); } } private handleKeyDown(event: any) { if (event.keyCode == 13) { // action } else if (event.keyCode == 40) { // action } else if (event.keyCode == 38) { // action } }

Pour la touche ENTER, pourquoi ne pas utiliser (keyup.enter) :

 @Component({ selector: 'key-up3', template: `  {{values}}
 ` }) export class KeyUpComponent_v3 { values = ''; }

Utilisez (keyup.enter) .

Angular peut filtrer les événements clés pour nous. Angular a une syntaxe spéciale pour les événements de clavier. Nous pouvons écouter uniquement la touche Entrée en nous liant au pseudo-événement keyup.enter d’Angular.

Voici la bonne solution ! Étant donné que le bouton n’a pas de type d’atsortingbut défini, angular pourrait tenter d’émettre l’événement keyup en tant que demande de soumission et déclencher l’événement click sur le bouton.

Un grand merci à DeborahK!

Angular2 – Enter Key exécute la première (clic) fonction présente sur le formulaire

 @Component({ selector: 'key-up3', template: `  {{values}}
 ` }) export class KeyUpComponent_v3 { doSomething(e) { alert(e); } }

Cela fonctionne pour moi!

 someMethod(event:any){ if(event.keyCode == 13){ alert('Entered Click Event!'); }else{ } }