In angular2 how to detect Ctrl A keypress?

Question

I have a list of elements, and I am trying to transfer the file moving behavior, for example file explorer, to the list of elements, which means, after selecting the element, if you hold the shift key and press the down arrow, these elements should be selected.

I have a list as below.

    <div class="container">
    <ul class="mylist">
    <li  tabindex="1">item1</li>
    <li  tabindex="2">item2</li>
    <li  tabindex="3">item3</li>
    <li tabindex="4">item4</li>
    <li tabindex="5">item5</li>
    <li tabindex="6">item6</li>
    <li tabindex="7">item7</li>
    <li tabindex="8">item8</li>
    <li tabindex="9">item9</li>
    <li tabindex="10">item10</li>
</ul>

If I use (keydown.ctrl.a)="handleKey($event, item.name)", it does not recognize ctrl and button. How can I achieve this in angular2?

Answer 1

Use controlinstead ctrl:

(keydown.control.a)="handleKey($event, item.name)"

Answer 2

Put this in handleKeyto detect pressing Ctrl + a:

event.getModifierState && event.getModifierState('Control') && event.keyCode===65

Demo