Keyboard Navigation
The Kendo UI for Angular ListView provides keyboard navigation support to enhance accessibility and improve user experience. Keyboard navigation is enabled by default, allowing users to navigate through the ListView using keyboard shortcuts. This feature is particularly useful for users who rely on keyboard navigation or assistive technologies.
Starting with Kendo UI for Angular v19.0.0, the ListView keyboard navigation is enabled by default. To disable it, set the
navigable
property tofalse
.
The ListView supports the following keyboard shortcuts:
SHORTCUT | DESCRIPTION |
---|---|
Right Arrow & Down Arrow | Moves the focus to the next item. If the focus is on the last item, the focus does not move. |
Left Arrow & Up Arrow | Moves the focus to the previous item. If the focus is on the first item, the focus does not move. |
Home | Moves the focus to the first rendered item. |
End | Moves the focus to the last rendered item. |
Controlling the Focus
To control the focus of the ListView items, use any of the following methods and props:
focus(index?: number)
—Focuses the item at the targeted index. If no param is provided, the item that last received focus will be focused.activeIndex
—Gets the index of the item that last received focus. You can use this value as a starting point when you perform external navigation.
When the ListView is not
navigable
, theactiveIndex
property returnsnull
and thefocus
method will no not have any effect.
The following example demonstrates how external focus management can be performed.