JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/1.1.3/angular.min.js"></script>
<div ng-app>
  <h2>Example</h2>
  <div ng-controller="myController">

      <p>The new ng-keydown directive works perfectly fine as long as it is bound to an input field. Type to see keyCode: </p>
      <input ng-keydown="keypress($event)">
          <p>last key: {{lastKey}}</p>
          <div ng-keydown="keypress($event)" style="border: 1px solid blue;">
<p>Focusing this div (blue border) and typing however does not work, in spite of the documentation saying that the context for ng-keydown can be anything: http://code.angularjs.org/1.1.3/docs/api/ng.directive:ngKeydown</p>
<p>I can't seem to get it to cooperate unless there is an input field:
<input>
    </p>
    <p>How can I use ng-keydown for the entire document or selected spans, etc.?
    </p>
          </div>
  </div>
</div>

JavaScript

function myController($scope) {
  $scope.lastKey = "---"

  $scope.keypress = function($event) {
    $scope.lastKey = $event.keyCode
  };
    
}