Я работаю над проектом Angular2, в котором у меня есть список элементов, и, щелкая любой элемент, отображается его страница сведений с использованием компонента сведений об элементе. Я пытаюсь найти способ, позволяющий пользователям перемещаться по элементам с помощью клавиш со стрелками вправо и влево.

Итак, у меня есть список элементов, и когда, например, пользователь щелкает по первому элементу в списке, он показывает детали элемента, теперь я хочу, чтобы, когда пользователь нажимал клавишу со стрелкой вправо, он автоматически загружал детали следующего элемента в списке. ,

У меня есть два компонента ItemsListComponent и ItemDetailsComponent, каждый из которых имеет собственный маршрут, ItemDetailsComponent имеет идентификатор параметра. И у меня есть список предметов, хранящихся в ItemsService.

У меня есть две кнопки в компоненте ItemDetails для отображения следующего и предыдущего элемента, каждый из которых привязывается к функциям showNext (id) и showPrevious (id) на одном и том же компоненте.

Все работает нормально, но я не могу связать событие KeyPress со стрелкой вправо / влево с функциями showNext (id) и showPrevious (id).

Я подумал об одном подходе, который заключается в добавлении прослушивателя событий с использованием addEventListener в документе, в конструкторе компонента, но это не кажется элегантным решением.

Любая помощь, связанная с этим, будет принята с благодарностью.

PS: я не использую jQuery, поэтому ищу чистое решение Angular2