Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Drag using keyboard arrow keys. (Angular)

See original GitHub issue

For more better user experience I want to drag target on keyboard arrow keys. Is there any way to drag using keyboard arrow keys. I am in the middle of following.

document.addEventListener('keydown', (e) => {
   if (e.keyCode === 38) {
       // I think here I should trigger onDrag, but unable to trigger
   }
 });

Thanks in advance.

Issue Analytics

State:
Created 4 years ago
Reactions:2
Comments:6 (2 by maintainers)

Top GitHub Comments

1reaction

daybrushcommented, Mar 4, 2020

@iprasadg

moveable 0.15.1
react-moveable 0.18.0
preact-moveable 0.17.0
ngx-moveable 0.11.0
svelte-moveable 0.6.0

Added request method.

https://daybrush.com/moveable/release/latest/doc/Moveable.html#request

Applied to the main demo.

https://daybrush.com/moveable/

https://github.com/daybrush/moveable/blob/482e8d63c74de82e966a638472a984f9a08ce85b/demo/src/Editor.ts#L60-L77

1reaction

daybrushcommented, Jan 2, 2020

@iprasadg

I think that’s a good idea. I planned to add it later, but it’s not easy.

This may seem a bit late, but I will try to do it fast.

Top Results From Across the Web

How to Add Keyboard Navigation to Angular Lists

In this article, we'll go through one such challenge: implementing keyboard navigation to a list component. An example use-case can be an ...

Angular 7 how to keep focus on an element while using the ...

Angular 7 how to keep focus on an element while using the arrow keys for “drag and drop” via keyboard. Up arrow works...

Mapping arrow keys to switch between photos in Angular

Mapping arrow keys to switch between photos in Angular ... map them to the left and right arrow keys on the keyboard, and...

Angular (forked) - StackBlitz

CdkDrag} from '@angular/cdk/drag-drop'; ... from '@angular/cdk/. a11y';. /**. * Enables keyboard navigation (home, end,. arrow keys) across the host element.

Doing A11y easily with Angular CDK. Keyboard-Navigable Lists

There are two common techniques that can help us to implement keyboard navigation for lists. Each technique gives us the ability to interact...