Angularjs UI bootstrap selezionare dinamicamente tra le schede statici non lavorano

Question

Ho tre linguette statici e un pulsante che con ng clic = "selectThirdTab()"

funzione

<div ng-controller="Ctrl"> 
     <input type="button" value="Select third tab" ng-click="selectThirdTab()" /> 
     <tabset justified="true"> 
      <tab heading="First" active="isFirstActive"></tab> 
      <tab heading="Second" active="isSecondActive"></tab> 
      <tab heading="Third" active="isThirdActive"></tab> 
     </tabset> 
</div> 

"selectThirdTab" è la seguente:

$scope.selectThirdTab = function() { 
    $scope.isThirdActive = true; 
} 

il plunker è qui: Plunker

Inizialmente la prima scheda è selezionata, si fa clic sul pulsante e il risultato è il terzo pulsante selezionato. Ora se selezioni un'altra scheda e poi fai nuovamente clic sul pulsante "Seleziona terza scheda", il terzo pulsante non viene selezionato. Cosa c'è che non va?

Answer 1

Oppure si può andare in quel modo:

angular.module('plunker', ['ui.bootstrap']); 
var Ctrl = function ($scope, $timeout) { 
    $scope.isActive = [{active:true},{active:false},{active:false}]; 
    $scope.selectThirdTab = function() { 
      $scope.isActive[2].active = true; 
    } 
} 

e in html

<tabset justified="true"> 
     <tab heading="First" active="isActive[0].active"></tab> 
     <tab heading="Second" active="isActive[1].active"></tab> 
     <tab heading="Third" active="isActive[2].active"></tab> 
    </tabset> 

Answer 2

una sola scheda può essere attivo alla volta:

$scope.selectThirdTab = function() { 
    $scope.isThirdActive = true; 
    $scope.isSecondActive=false; 
    $scope.isFirstActive=false; 
} 

Answer 3

Basta sostituire il seguente codice

$scope.selectThirdTab = function() { 
     $scope.isThirdActive = true; 
    } 

da

$scope.selectThirdTab = function() { 
    $scope.isFirstActive=false; 
    $scope.isSecondActive=false; 
    $scope.isThirdActive = true; 
} 

Spero che vi aiuterà.

Immagino che questo esempio possa aiutarti. http://plnkr.co/edit/7XvmsjAZ1DrA0K4F6kiw?p=preview