Edit in JSFiddle

var app = angular.module('MyApp', ['ui.bootstrap']);
var ModalController = function ($scope) {

  $scope.open = function () {
    $scope.isOpen = true;
  };

  $scope.close = function () {
    $scope.isOpen = false;
  };
};

app.directive('focusMe', function($timeout, $parse) {
  return {
    link: function(scope, element, attrs) {
      var model = $parse(attrs.focusMe);
      scope.$watch(model, function(value) {
        if(value === true) { 
          $timeout(function() {
            element[0].focus(); 
          });
        }
      });
      element.bind('blur', function() {
        scope.$apply(model.assign(scope, false));
      })
    }
  };
});
<div ng-controller="ModalController">
    <button class="btn" ng-click="open()">Click to Open Modal</button>
   
    <div modal="isOpen" close="close()">
        <div class="modal-header">
            <h4>Modal</h4>
        </div>
        <div class="modal-body">
            Name: <input type="text" focus-me="isOpen">
        </div>
        <div class="modal-footer">
            <button class="btn btn-warning cancel" ng-click="close()">Cancel</button>
        </div>
    </div>
</div>

              

External resources loaded into this fiddle: