web-dev-qa-db-fra.com

Angular 2: focusin et focusout peuvent-ils être dans un même événement?

focusin et focusout peuvent-ils être dans un même événement? Comment ça s'appelle alors? Sinon, existe-t-il un moyen de fusionner cela en une seule fonction?

hide(e:any) {
  $('.suggestion').hide();
}
show(e:any) {
  $('.suggestion').show();
}
<section class="search-bar-wrapper" (focusout)="hide($event)" (focusin)="show($event)">
angulareventshideshow
8
Char

La première chose est que vous devez ajouter l'attribut tabindex à section pour obtenir l'événement focus. Sinon, il ne recevra pas d'événement de focus.

L'événement Focus est déclenché lorsqu'un élément est capable de se concentrer. Chaque fois que vous cliquez sur l'élément, il est toujours focalisé et nous pouvons supprimer le focus uniquement en cliquant à l'extérieur de l'élément. Donc, nous ne pouvons pas supprimer le focus sur l'événement click du même élément.

focus et focusout les deux sont des événements différents, nous ne pouvons pas les fusionner

Vous pouvez utiliser *ngIf également

<section class="search-bar-wrapper" tabindex="-1" (focus)="show($event)" (focusout)="hide($event)">

<div class="suggestion" *ngIf="canSee">This is a suggestion</div>

dans la classe du composant

casSee: boolean = false;

show(e: any) {
   this.canSee = true;
}
hide(e: any) {
   this.canSee = false;
}
16
Mr_Perfect

Vous pouvez utiliser (focus) et (focusout) in Angular 2/4.

6
Deepak swain