Привязка одного и того же события наведения курсора к нескольким [ngClass]

<li class = "dropdown-submenu dropdown pointer" (mouseover) = "toogleClickEvent($event)" (mouseout) = "toogleClickEvent($event)"
  [ngClass] = "show">
  <a class = "test" tabindex = "-1"><i class = "fa fa-language " aria-hidden = "true"></i>{{'Language' | translate}}</a>
  <ul class = "dropdown-menu">
    <li class = "pointer"><a (click) = "changeLang('en')">{{'English' | translate}}</a></li>
  </ul>
</li>

<li class = "dropdown-submenu dropdown pointer" (mouseover) = "toogleClickEvent($event)" (mouseout) = "toogleClickEvent($event)"
  [ngClass] = "show1">
  <a href = "#"><i class = "fa fa-gear" aria-hidden = "true"></i>&nbsp;&nbsp;{{'Settings' | translate}}</a>
  <ul class = "dropdown-menu">
    <li class = "pointer"><a>{{'Default' | translate}}</a></li>
  </ul>
</li>

app.ts

export class app{
   show: string;
   toogleClickEvent($event) {
      this.show =   $event.type == 'mouseover' ? 'open' : '';
   }
}

В приведенном выше коде у меня есть два раскрывающихся списка, в которых я вызываю toogleClickEvent () в обоих раскрывающихся списках, но из-за того же метода и того же [ngclass] для обоих значений раскрывающегося списка я получаю Итак, как обрабатывать два разных [ngclss], используя один метод, кроме создания нового метода