title: AngularJS set initial active class
body: <p>I'm using <a href="http://twitter.github.io/bootstrap/javascript.html#tabs" rel="nofollow">Bootstrap tabs</a> with an <a href="http://docs.angularjs.org/api/ng.directive%3angRepeat" rel="nofollow">Angular ng-repeat</a>.</p>
  
  <p>The problem I'm running into is that the first <code>li</code> and the first <code>div.tab-pane</code> each need an active class. Bootstrap takes care of that <em>after</em> a tab is clicked but, as you can see, not on load.</p>
  
  <p>My question is, how can I set an active class on the first <code>li</code> and <code>div.tab-pane</code>?</p>
  
  <p>Demo:</p>
  
  <p><a href="http://jsfiddle.net/FQgHx/" rel="nofollow">http://jsfiddle.net/FQgHx/</a></p>