angular.js keypress directive event mysteriously not firing

Question

I followed this example Submit form on pressing Enter with AngularJS

but I cannot get it to work. It is totally baffling. Why does the keypress event not get trapped by my directive?

http://plnkr.co/edit/A9oio2F61yHssE49aiCb?p=preview

app.directive('enterKey', function($log) {
    return function(scope, element, attrs) {
        element.bind("keydown keypress", function(event) {
            if(event.which === 13) {

                scope.$apply(function(){
                    scope.$eval(attrs.ngEnter, {'event': event});
                });
                event.preventDefault();
            }
        });
    };
});

Answer 1

There is copy paste mistake in your directive attrs.ngEnter should be attrs.enterKey as you changed the directive name.

scope.$apply(function(){
    scope.$eval(attrs.enterKey, {'event': event});
});

Additionally you need to add event parameter inside your alertMe method to accept event

$scope.alertMe = function(event) {
    alert('I am alerted!');
}