My challenge lies in having six input fields arranged side by side in a single row:
In my component.html file:
onDigitInput(event: any) {
let element;
if (event.code !== 'Backspace')
element = event.srcElement.nextElementSibling;
console.log('Element : ',event.srcElement)
if (event.code === 'Backspace')
element = event.srcElement.previousElementSibling;
if (element == null)
return;
else
element.focus();
}
However, this solution has limitations as it requires all input elements to be directly adjacent without further nesting. In my case, each input is enclosed within an <li> tag, causing the functionality to fail. I am seeking suggestions for alternate solutions using functions or potentially a directive.