AngularJS引导选项卡在第一次后不会动态更改

<ul class="nav nav-tabs nav-tabs-simple" role="tablist">
  <li class="nav-item">
    <a href="#" ng-class="{active: activeTab =='a'}" data-toggle="tab" role="tab" data-target="#atab">A</a>
  </li>
  <li class="nav-item">
    <a href="#" ng-class="{active: activeTab =='b'}"  data-toggle="tab" role="tab" data-target="#btab">B</a>
  </li>
  <li class="nav-item">
    <a href="#" ng-class="{active: activeTab =='c'}" data-toggle="tab" role="tab" data-target="#ctab">C</a>
  </li>
</ul>

然后是实际选项卡:

<div class="tab-pane" ng-class="{'active': activeTab =='main'}" id="atab">
</div>
<div class="tab-pane" ng-class="{'active': activeTab =='main'}" id="btab">
</div>
<div class="tab-pane" ng-class="{'active': activeTab =='main'}" id="ctab">
</div>

所以这对我来说是第一次,我可以通过编程切换到第二个选项卡:

$scope.activetab='b';

但当我手动返回到选项卡“a”并触发调用相同函数的命令时,活动类仍保留在第一个选项卡上,并且不会以编程方式更改。

所以,我想知道我做错了什么,为什么我只能第一次导航,但之后就不能了。