AngularJS | ng-keydown Directive
The ng-keydown Directive in AngluarJS is used to apply custom behavior on a keydown event. It is supported by <input>, <select> and <textarea> elements.
Syntax:
<element ng-keydown="expression"> Contents... </element>
Example: This example uses ng-keydown Directive to change the background color after pressing the button.
<!DOCTYPE html> < html > < head > < title >ng-keydown Directive</ title > < script src = </ script > < style type = "text/css" > .keyDown { background-color: green; color: white; } .keyUp { background-color: white; } </ style > </ head > < body ng-app style = "text-align:center" > < h1 style = "color:green" > GeeksforGeeks </ h1 > < h2 >ng-keydown Directive</ h2 > < div > < b >Enter Name: </ b >< input type = "text" ng-model = "searchValue" ng-keydown = "keyDown=true" ng-keyup = "keyDown=false" ng-class = "{true:'keyDown', false:'keyUp'}[keyDown]" /> < br > </ div > </ body > </ html > |
Output:
Before pressing the button:
After pressing the button: