var app = angular.module('App', []);

​

// Apply given piece of code (as attribute) when the up arrow hit event is

// triggered.

app.directive('onUp', function () {

  return function (scope, elem, attrs) {

    elem.bind('keyup', function (e) {

      if (e.keyCode == 38)

        scope.$apply(attrs.onUp);

    });

  };

});

​

// Apply given piece of code (as attribute) when the down arrow hit event is

// triggered.

app.directive('onDown', function () {

  return function (scope, elem, attrs) {

    elem.bind('keyup', function (e) {

      if (e.keyCode === 40)

        scope.$apply(attrs.onDown);

        console.log("on down");

    });

  };

});

​

// Main Controller

function Ctrl($scope) {

  $scope.entries = [

    'apple',

    'ball',

    'cow'

  ];

  $scope.focusNext = function (entry) {

    console.info('Focus the entry after', entry);

  };

  $scope.focusPrev = function (entry) {

    console.info('Focus the entry before ', entry);

  };

}