Angular: Empty Fiddle

http://angularjs.org/

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css">
<link rel="stylesheet" href="http://angular-ui.github.com/angular-ui/build/angular-ui.css">
<script src="http://code.angularjs.org/1.0.1/angular-1.0.1.min.js"></script>
<script src="http://angular-ui.github.com/angular-ui/build/angular-ui.js"></script>
<div ng-controller="MyCtrl">
    <p>Try ENTER and ESC in <code>textarea</code> - it resets model OK. But if you do the same in <code>input text</code>, only the ENTER works. :(</p>
    
    <textarea ng-model="search.query" ui-keydown="{esc: 'keyCallback($event)', enter : 'keyCallback($event)'}"></textarea>
    <input ng-model="search.query" ui-keydown="{esc: 'keyCallback($event)', enter: 'keyCallback($event)'}" />
    
    <p>model = '{{search.query}}'</p>
</div>

CSS

body {
    margin: 3em;
}
p,
input,
textarea {
    display: block;
    margin: 0 0 1em 0;
}

JavaScript

var myApp = angular.module('myApp', ['ui']);

function MyCtrl($scope) {
    $scope.search = {
        query: 'some input'
    }
    
    $scope.keyCallback = function($event) {
        $event.preventDefault();
        $scope.search.query = '';
    }
}