title: how to set active on angularjs bootstrap tab with static content
body: <p>I am using Angular Bootstrap UI to show a tabset with static content. The bootstrap script I include is ui-bootstrap-tpls-0.6.0.min.js.</p>
  
  <p>here is my markup:</p>
  
  <pre><code>&lt;tabset&gt;
      &lt;tab ng-show="$parent.hideme" ng-class="{active:$parent.hideme}"&gt;
          &lt;tab-heading&gt;
              tab1
          &lt;/tab-heading&gt;
          &lt;div&gt;
              tab content 1
          &lt;/div&gt;
      &lt;/tab&gt;
      &lt;tab ng-hide="$parent.hideme" ng-class="{active:!$parent.hideme}"&gt;
          &lt;tab-heading&gt;
              tab2
          &lt;/tab-heading&gt;
          &lt;div&gt;
              tab content 2
          &lt;/div&gt;
      &lt;/tab&gt;
  &lt;/tabset&gt;
  </code></pre>
  
  <p>Here is the controller</p>
  
  <pre><code>function myController($scope) {
      $scope.hideme = false;
  });
  </code></pre>
  
  <p>If I don't have ng-class applied on the tab, it works well except that when the 1st tab hide and 2nd tab show ($scope.hideme = false), the content of the 1st tab will show avtive.</p>
  
  <p>If I added ng-class, it caused an error in angularjs. Error: [$parse:syntax] <a href="http://errors.angularjs.org/undefined/" rel="nofollow">http://errors.angularjs.org/undefined/</a>$parse/syntax?p0=%7B&amp;p1=is%20an%20unexpected%20token&amp;p2=16&amp;p3=%7Bactive%3Afalse%7D%20%7Bactive%3A%20active%2C%20disabled%3A%20disabled%7D&amp;p4=%7Bactive%3A%20active%2C%20disabled%3A%20disabled%7D</p>
  
  <p>What is the right way(or right syntax) to make the specific tab active?</p>