title: Angular Bootstrap Modal popup autofocus not working
body: <p>I have implemented a <a href="https://github.com/angular-ui/bootstrap/tree/master/src/modal" rel="noreferrer">bootstrap modal using angular bootstrap</a> which works fine.</p>
  
  <p>Here is a <a href="http://plnkr.co/edit/XkZ4rDsssLXB7UuhP6GW?p=preview" rel="noreferrer">plunker link</a> for the code I have used.</p>
  
  <p>In my modal I have only one input field (textbox) which needs to be filled by the user and a save and cancel button. I want that when the modal is shown the textbox should have the focus.</p>
  
  <p>I tried the <code>autofocus</code> attribute which works otherwise not working in this case.</p>
  
  <p>Pasted below is my html on the modal.</p>
  
  <pre><code>&lt;div class="modal-header panel panel-heading"&gt;
      &lt;button type="button" class="close" ng-click="ok()"&gt;×&lt;/button&gt;
      &lt;h4 class="modal-title"&gt;Add Project&lt;/h4&gt;
  &lt;/div&gt;
  &lt;div class="modal-body"&gt;
      &lt;input autofocus="autofocus" type="text" class="form-control" id="ProjectName" placeholder="Enter project name here" data-ng-model="ProjectName" tab-index="1"/&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer"&gt;
      &lt;button class="btn btn-primary" ng-click="ok()" tab-index="2"&gt;Create&lt;/button&gt;
      &lt;button class="btn btn-default" ng-click="cancel()" tab-index="3"&gt;Cancel&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How do I get this to work ?</p>