Angular 2：focusin和focusout可以在一个事件中吗？

Question

focusin和focusout可以合成一个事件吗？如果不行，有没有一种方法将它们合并到一个函数中？

hide(e:any) {
  $('.suggestion').hide();
}
show(e:any) {
  $('.suggestion').show();
}

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

- Char

Answer 1

首先，您需要将tabindex属性添加到section中，以使其获得焦点事件。否则，它不会获得焦点事件。

当元素可聚焦时，焦点事件会被触发。每次单击该元素时，它都会获得焦点，并且我们只能在单击元素外部时才能取消焦点。因此，我们无法在相同元素的click事件上删除焦点。

focus和focusout都是不同的事件，我们不能将它们合并。

您也可以使用*ngIf

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

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

组件的类别中

casSee: boolean = false;

show(e: any) {
   this.canSee = true;
}

hide(e: any) {
   this.canSee = false;
}

- Mr_Perfect

---

我认为那是另一个功能，对吧。你可以提出问题，而不是继续这个。 - Mr_Perfect

谢谢！它有效。 - Gerardo Bautista

Answer 2

您可以在Angular 2/4中使用(focus)和(focusout)。

- Deepak swain