How to check for spacebar key event via angular?

Question

I have an angular template that uses this syntax within:

(click)="dosomething()"

that works fine. I now need to have that same event fire on return or spacebar. I added this for return:

(keyup.return)="dosomething()"

that also works fine.

Got to spacebar and I can't get that to work. I've tried both...

(keyup.space)="dosomething()"

...as well as...

(keyup.spacebar)="dosomething()"

...but neither is working. In both cases, pressing space just defaults to browser behavior and scrolls the page down a bit.

The keyup even seems to be the documented solution (at least as far as I've been able to find) so am stumped as to what I might be missing here.

Answer 1

To achieve expected result, use (keyup.Space) instead of (keyup.space) ('S' in upperCase)

<input (keyup.Space)= "doSomething()">

working code sample for reference- https://stackblitz.com/edit/angular-dmvr52?file=src/app/app.component.html