2016-08-04 89 views
0

射擊,我嘗試使用引導選項卡與angularjs &增加了NG-點擊設置選項卡上的活動類,但它沒有發生,下面是我的代碼:NG-點擊不angularjs

<ul class="nav nav-tabs" role="tablist"> 
     <li role="presentation" ng-class="{ 'active': tab === 1 }"><a href="#email" aria-controls="email" role="tab" data-toggle="tab" ng-click="tab = 1">Email</a></li> 
     <li role="presentation" ng-class="{ 'active': tab === 2 }"><a href="#phone" aria-controls="phone" role="tab" data-toggle="tab" ng-click="tab = 2">Phone</a></li> 
     <li role="presentation" ng-class="{ 'active': tab === 3 }"><a href="#username" aria-controls="username" role="tab" data-toggle="tab" ng-click="tab = 3">Username</a></li> 
    </ul> 

標籤的價值沒有改變,這就是爲什麼特定的班級沒有得到應用。

回答

0

在你的控制,儘量使用

$scope.obj = { tab : 1}; 

,然後在視圖:

obj.tab 

而不只是標籤

+0

仍然沒有運氣,其相同 –

+0

當頁面重新加載此檢查'ng-class =「{'active':tab === 1}」'工作正常,但然後onclick標籤的值不會改變 –

1

只要改變=====,它應該工作:

<ul class="nav nav-tabs" role="tablist"> 
    <li role="presentation" ng-class="{ 'active': tab == 1 }"><a href="#email" aria-controls="email" role="tab" data-toggle="tab" ng-click="tab = 1">Email</a></li> 
    <li role="presentation" ng-class="{ 'active': tab == 2 }"><a href="#phone" aria-controls="phone" role="tab" data-toggle="tab" ng-click="tab = 2">Phone</a></li> 
    <li role="presentation" ng-class="{ 'active': tab == 3 }"><a href="#username" aria-controls="username" role="tab" data-toggle="tab" ng-click="tab = 3">Username</a></li> 
</ul> 

JSFiddle here

+0

其實我有路由器以及#email,#phone正在創建問題,它改變了路線,所以我如何禁用它? –

+0

我認爲你應該爲這個問題發佈另一個問題(我們將需要你的JS文件在你定義你的路線)。 :) – Mistalis