Possibility to load next element via arrow keys without opening?

[andorfermichael]

Is there an easy option to select the previous or next element just by using arrow keys without opening the select field?

[andorfermichael]

I solved this using the @keydown event as follows:

function onKeydown($event: any, select$: any) {
    if ($event.key === 'ArrowLeft') {
        const currentIndex = select$.options.findIndex((option: SelectFieldOption) => {
            return select$.isSelected(option)
        })

        let nextIndex: number = currentIndex
        if (nextIndex > 0) {
            nextIndex = currentIndex - 1
        }

        select$.select(select$.options[nextIndex].value)
    }

    if ($event.key === 'ArrowRight') {
        const currentIndex = select$.options.findIndex((option: SelectFieldOption) => {
            return select$.isSelected(option)
        })

        let nextIndex: number = currentIndex
        if (nextIndex + 1 < select$.options.length) {
            nextIndex = currentIndex + 1
        }

        select$.select(select$.options[nextIndex].value)
    }
}