Skip to content
Related Articles

Related Articles

AngularJS | ng-keypress Directive
  • Last Updated : 26 Mar, 2019

The ng-keypress Directive in AngluarJS is used to apply custom behavior on a keypress event. It is supported by <input>, <select> and <textarea> element.

Syntax:

<element ng-keypress="expression"> Contents... </element>

Where expression tells what to do when key is pressed.

Example: This example uses ng-keypress Directive to display key value.




<!DOCTYPE html>
<html>
      
<head>
    <title>ng-keypress Directive</title>
      
    <script src=
    </script>
      
    <script type="text/javascript">
        var app = angular.module('app', []);
        app.controller('geek', function ($scope) {
            $scope.getkeys = function (event) {
                $scope.keyval = event.keyCode;
            }
        });
    </script>
</head>
  
<body style="text-align:center">
    <div ng-app="app" ng-controller="geek">
        <h1 style="color:green">
            GeeksforGeeks
        </h1>
          
        <h2>ng-keypress Directive</h2>
          
        Enter Text: <input type="text"
                ng-keypress="getkeys($event)" >
          
        <br><br>
          
        <span style="color:Red">
            Key Code: {{keyval}}
        </span>
    </div>
</body>
  
</html>

Output:
ngkeypress

Attention reader! Don’t stop learning now. Get hold of all the important DSA concepts with the DSA Self Paced Course at a student-friendly price and become industry ready.




My Personal Notes arrow_drop_up
Recommended Articles
Page :