Bootstrap 选项卡 Active/inactive 和 Angularjs

Question

我在此处使用 Angularjs 和 Bootstrap 选项卡我的代码：

  <body  ng-controller="TabsCtrl">
    <button ng-click="addNewWorkspace('jobs')">Open Tab jobs<i class="icon-plus-sign"></i></button> 
    <button ng-click="addNewWorkspace('invoices')">Open Tab invoices<i class="icon-plus-sign"></i></button> 
    <button ng-click="addNewWorkspace('payments')">Open Tab payments<i class="icon-plus-sign"></i></button> 

    <ul class="nav nav-tabs">
      <li ng-class="tabClass(tab)" ng-repeat="tab in tabs" tab="tab">
        <a href="{{tab.link}}" ng-click="setSelectedTab(tab)">{{tab.label}}
        <button ng-click="removeTab($index)">-<i class="fa fa-times"></i></button>
        </a>
      </li>
    </ul>
    <div ng-view></div>

  </body>

当我按下任何按钮时，它会打开一个新标签，这是我的第一个问题，标签已创建但未激活，我需要按创建的标签才能看到信息。

我的第二个问题是当我打开任何选项卡并关闭时，该选项卡不显示有关其他打开的选项卡的信息。例如：我打开付款并打开此选项卡，当我关闭它时不显示工作信息。

我做了什么？

我尝试在 add/remove 工作区时使用 $location.path 来强制显示任何其他选项卡，但这不起作用。我也试过 $window 结果相同。

不知道我是不是把概念搞混了

Live Demo With complete code

Answer 1

$scope.addNewWorkspace = function(page) {
var tab = {
    link: '#/' + page,
    label: page
};
$scope.tabs.push(tab);
$scope.selectedTab = tab;
$location.path('/' + tab.label);
};

选择当前标签为selectedTab

$scope.selectedTab=tab;

重定向到新位置

$location.path('/'+tab.label);

Bootstrap 选项卡 Active/inactive 和 Angularjs

Bootstrap tab Active/inactive and Angularjs

javascript

tabs

twitter-bootstrap

angularjs