npm install ngx-focus-control --saveNgx focus control
Library to provide tools to work with focus and focusable elements to improve user interfaces and accessibility.
Angular library to provide tools to work with focus and focusable elements to improve user interfaces and accessibility.
Focus control directive
This directive allows the user to manually define the next and/or previous focus target.
Example shows how to revert direction of focus. Focus the first element and navigate using the keyboard (TAB and SHIFT + TAB).
Code
<input placeholder="Input 1" class="input" id="input-1" [fuControl]="{next: '#input-3', previous: input2}">
<input #input2 placeholder="Input 2" class="input" id="input-2" [fuControl]="{next: '#input-1', previous: '#input-3'}">
<input placeholder="Input 3" class="input" id="input-3" [fuControl]="{next: input2, previous: '#input-1'}">