Navegação entre li com a seta do teclado.

Esse é o input

<input #assuntoEl class="form-control input-layout click-variaveis" placeholder="Escreva o Assunto" (keyup)="autoComplete($event)"/>

Essa é a div com a lista

<div #variaveisEl class="col-lg-16 ac-container container-variaveis">
    <ul #listaDeVariaveisEl class="ac-menu lista-variaveis">
        <li *ngFor="let variavel of variaveisAssuntoFiltradas; let indexLista = index" (click)="adicionarVariavel(variavel.chave)">
            <a class="row texto-variaveis">
                <div class="col-xs-5">{{variavel.nome}}</div>
                <div class="col-xs-7 text-uppercase">{{variavel.chave}}</div>
                <div class="col-xs-4 text-right text-muted pull-right text-capitalize">{{variavel.tipo}}</div>
            </a>
        </li>
    </ul>
</div>

Resolvi, galera.

Usei um @ViewChildren do tipo TemplateRef<HTMLLIElement> para pegar os todas as LIs da lista, usei os KeyboardEvent pra pegar qual tecla estava usando e criei uma variável só para armazenar a posição do array em que eu estava.

Caso apertasse para cima, subtraía 1 na variável, caso apertasse pra baixo, somava 1 na variável. Para mostrar em qual elemento eu estava, adicionava uma classe no elemento atual e removia a classe do elemento anterior, e essa classe tinha um background-color diferente.

E ao apertar o Enter, eu pegava o elemento da lista na posição daquela variável que subtrai ou soma.

Vou finalizar a dúvida. Valeu!