navigate a list using keyup.arrowDown and keyup.arrowUp

  angular, html, javascript, typescript

I am trying to navigate a list in my angular component using keyup.arrowDown and keyup.arrowUp. I am not sure how to used the index to be able to do that , here is what I got to do so far.

public nextActiveMatch(): void {
        this.activeIndex = this.activeIndex < this.list.length - 1 ? ++this.activeIndex : this.activeIndex;
    public prevActiveMatch(): void {
        this.activeIndex = this.activeIndex > 0 ? --this.activeIndex : 0;
  <div class="selection-list-standard" *ngIf="showList">
    <div class="selection-list">
        *ngFor="let item of list | appFilter: searchText; let i = index"
          [ngClass]="{ displayAnEllipsis: shouldDisplayAnEllipsis() }"
          {{ item }}</span

I am new to this any help will be really appreciated. thanks

Source: Ask Javascript Questions