Directive to focus an element on pages with an example to use it.

focusElement.js

angular.module('app.directives')

.directive('focusElement', ['$timeout', function($timeout) {
  return {
    link: function(scope, element, attrs) {
      scope.$watch(attrs.focusElement, function(value) {
        if(value === true) { 
          $timeout(function () {
            element[0].focus();
          });
        }
      });
    }
  };
}]);

focusElementExample.html

<!-- Example to focus column of the table -->
<table>
  <tr ng-repeat="data in dataRows track by $index">
    <td>
      <input type="text"  arrow-keys-index="{{$index}}:1" ng-model="data.column1" focus-element="$index == 0 ? true : false"/>
    </td>
    <td>
      <input type="text"  arrow-keys-index="{{$index}}:2" ng-model="data.column2" />
    </td>
    <td>
      <input type="text"  arrow-keys-index="{{$index}}:3" ng-model="data.column3" />
    </td>
    <td>
      <input type="text"  arrow-keys-index="{{$index}}:4" ng-model="data.column4" />
    </td>
  </tr>
</table>