AngularJS設置初始活動類

Question

我正在使用Bootstrap tabs和Angular ng-repeat。

我遇到的問題是，第一個li和第一個div.tab-pane都需要一個活動類。 Bootstrap在之後照顧單擊一個選項卡，但是，如您所見，不在加載。

我的問題是，我怎樣才能在第一個li和div.tab-pane上設置一個活動類？

演示：

http://jsfiddle.net/FQgHx/

Answer 1

所有你需要做的就是把一個ng-class指令上，你想主動最初的標籤和標籤窗格。您可以將ng-class指令中的$index == 0表達式更改爲任何您想要的。這可以在你的範圍中使用一個函數或變量。

下面是一個JS提琴展示如何做到這一點： http://jsfiddle.net/digitalzebra/qqPZd/

這裏是最後的代碼...注意納克級的指令：

<div ng-app> 
    <div ng-init="names = [{name:'one'}, {name:'two'}, {name:'three'}, {name:'four'}, {name:'five'}]"> 
    <ul class="nav nav-tabs"> 
    <li ng-repeat="name in names" ng-class="{active: $index == 0}"> 
     <a href="#tab{{$index + 1}}" data-toggle="tab">Week {{acute.Week}}</a> 
    </li> 
    </ul> 
    <div class="tab-content"> 
    <div class="tab-pane fade in" id="tab{{$index + 1}}" ng-repeat="name in names" ng-class="{active: $index == 0}"> 
     <p>{{$index + 1}}</p> 
    </div> 
    </div> 
</div> 
</div>