feat(timepicker) - add keyboard navigation

[nadavten]

bug

timer - arrowKeys not working.

and i dont see the arrows (up and down) for each input of hour:minutes

[zacharybil]

Setting [arrowkeys]="false" doesn't seem to change any behavior for me either.

Are you sure you don't have [showSpinners]="false"? That removes the up down arrow chevrons.

[nadavten]

Im sure

On Mon, Oct 3, 2016, 23:43 Zachary Billington notifications@github.com
wrote:

Setting [arrowkeys]="false" doesn't seem to change any behavior for me
either.

Are you sure you don't [showSpinners]="false"? That removes the up down
arrow chevrons.

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
#1007 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AQ-rrFThv6nMUZZU8B3rnAP6nfi4XHNBks5qwWjlgaJpZM4KCIfH
.

[SystemDisc]

Pressing the arrow keys on my Macbook Air (macOS Sierra) in the latest Chrome does not change the value in the timepicker, even if I explicitly state [arrowkeys]="true". It does not work on the demo page for me, either: https://valor-software.com/ng2-bootstrap/#/timepicker

[SystemDisc]

It may be that pressing up by default puts the cursor at the beginning of the input and down puts it at the end. Perhaps you need to e.preventDefault();

[rishuvaid]

'arrowkeys' property is not working for me either. Is it fixed yet? or is there something I may be missing?

[SystemDisc]

It's still not working.

I ended up putting a hacky jQuery script in a plain JS file that I link to in my header.

$(function() {
	$(document).on('keydown', 'timepicker input[type=text], timepicker button', function(e) {
		if (e.keyCode === 38 || e.keyCode === 40) {
			e.preventDefault();
			e.stopPropagation();
			let $this = $(e.currentTarget);
			let index = $this.closest('td').index();
			if ($this.is(':not(button)')) {
				if (e.keyCode === 38) {
					$this.closest('table').find('tr').first().find('td:nth-child(' + (index + 1) + ') a > *').first().click();
				}
				else {
					$this.closest('table').find('tr').last().find('td:nth-child(' + (index + 1) + ') a > *').first().click();
				}
			}
			else {
				$this.click();
			}
		}
	});
});

This works even with the buttons hidden.

[IlyaSurmay]

fixed in #2058