角度のUIタブ - アクティブなタブをプログラム的に変更

Question

私は2つの角度uiタブを持つウェブページを持っています。このページに新しいボタンを追加して、このボタンをクリックする動作を追加したいと思います。ボタンがクリックされたら、そのタブを他のタブにスワップします。例えば

：

• 現在アクティブなタブが「最初」の場合 - 「第二」タブがアクティブになるようにします。
• 現在アクティブなタブが「2番目」の場合 - 「最初の」タブをアクティブにします。私は私の問題の一つはactive="selected"セグメントに応じていることをかなり確信して http://plnkr.co/edit/2ajxz7oGYmF8oPlHc8kc

  <uib-tabset type="pills" active="selected"> 
      <uib-tab heading="First" index="1"> 
      First data 
      </uib-tab> 
      <uib-tab heading="Second" index="2"> 
      Second data 
      </uib-tab> 
  </uib-tabset> 
  

  ：ここ

は私の（ない）実施例です。これは、変数が$scopeに置かれることを期待しているので、タブセットの別のスコープで実行されています。回避策を使用してこの問題を解決しようとしましたが、このセグメントをactive="$parent.$parent.selected"に変更すると成功しません。

$scope.swap = function() { 
    alert($scope.selected); 
    if ($scope.selected == 1) 
     $scope.selected = 2; 
    else 
     $scope.selected = 1; 
    } 

がどのように私は右のそれを行う必要があります。

だから、主な問題はswap()機能ですか？

感謝:)

Answer 1

あなたは角度UIブートストラップ（0.14.3）

<uib-tabset> 
    <uib-tab heading="First" active="selected == 1"> 
    First data 
    </uib-tab> 
    <uib-tab heading="Second" active="selected == 2"> 
    Second data 
    </uib-tab> 
</uib-tabset> 

また、詳細は参照文書（http://angular-ui.github.io/bootstrap/versioned-docs/0.14.3/#/tabs）

作業の古いバージョンを使用していますPlunkr（http://plnkr.co/edit/qAbUtv06ck64JCf8JaKp?p=preview）

PS。上のコードは、バージョン1.2.0で動作します。バージョンをアップグレードするオプションがある場合は、それも可能です。