user6561376
user6561376

Reputation:

Angular, how to hit enter on input to run a function?

I'm trying to figure out a good way in Angular to run a function by hitting enter from an input in a form. I found this on a stackoverflow post:

    $(".input1").keyup(function (e) {
        if (e.keyCode == 13) {
            // Do something
        }
    });

but I'm wondering if there is a better way to do it.

Upvotes: 7

Views: 8915

Answers (2)

Sami Triki
Sami Triki

Reputation: 408

Why not using ng-submit ?

<form ng-submit="myfunction()">
    <input ng-model="myvalue" type="text">
    <input type="submit" value="submit">
<form>

it will execute whatever function is on ng-submit whenever you either click the button, or press enter.

https://docs.angularjs.org/api/ng/directive/ngSubmit

you can see in the example that you can just press enter.

also the submit input can be optional

Upvotes: 6

Jaromjj
Jaromjj

Reputation: 326

I use a directive like this:

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

Then, in the HTML you can do this:

<input type="text" ng-model"whatever" ng-enter"submitAFunction()">        

Upvotes: 9

Related Questions