How to use a keypress event in AngularJS?

by

You need to add a directive, like this:

Javascript:

app.directive('myEnter', function () {
    return function (scope, element, attrs) {
        element.bind("keydown keypress", function (event) {
            if(event.which === 13) {
                scope.$apply(function (){
                    scope.$eval(attrs.myEnter);
                });

                event.preventDefault();
            }
        });
    };
});

HTML:

<div ng-app="" ng-controller="MainCtrl">
    <input type="text" my-enter="doSomething()">    
</div>

More Related Contents:

  1. Enable angular-ui tooltip on custom events
  2. angularjs share data config between controllers
  3. How to detect browser using angularjs?
  4. angularjs text area character counter
  5. Is this a “Deferred Antipattern”?
  6. When to favor ng-if vs. ng-show/ng-hide?
  7. AngularJS 1.5+ Components do not support Watchers, what is the work around?
  8. How can I dynamically add a directive in AngularJS?
  9. How to reload the current state?
  10. How to use the ‘replace’ feature for custom AngularJS directives?
  11. What is the best way to conditionally apply attributes in AngularJS?
  12. When writing a directive in AngularJS, how do I decide if I need no new scope, a new child scope, or a new isolated scope?
  13. Unit Testing AngularJS directive with templateUrl
  14. How to select an element by classname using jqLite?
  15. Confused about Angularjs transcluded and isolate scopes & bindings
  16. Angular: calling controller function inside a directive link function using &
  17. Angular directive how to add an attribute to the element?
  18. AngularJS: ng-repeat list is not updated when a model element is spliced from the model array
  19. get original element from ng-click
  20. Scope issue in AngularJS using AngularUI Bootstrap Modal
  21. angular directive encapsulating a delay for ng-change
  22. AngularJS leaves comments in HTML: is it possible to remove them?
  23. When to use the AngularJS `$onInit` Life-Cycle Hook
  24. AngularJS – how to override directive ngClick
  25. AngularJS: ngInclude vs directive
  26. Angular directive name: only lower case letters allowed?
  27. Angular bootstrap datepicker date format does not format ng-model value
  28. ng-click doesn’t work within the template of a directive
  29. creating a new directive with angularjs
  30. AngularJS – Directives vs Controllers

Leave a Comment