Angularjs 如何在Angular Bootstrap UI中从一开始就激活选项卡？

我正试图使其中一个选项卡处于活动状态（选项卡已在模板中），具体取决于一些url参数。不幸的是，默认情况下，它总是使html模板中找到的第一个模板处于活动状态，即使我像本例中那样使用ng repeat

这不起作用：

$scope.tabs = {
        title2: {active:false, content:"Hello world 2!"},
        title3: {active:false, content:"Hello world 3!"},
        title4: {active:false, content:"Hello world 4!"}
    }
    $scope.tabs.title4.active = true;

---

这里有一个提示：

您需要在控制器内使用$routeParams服务，并从中设置$scope活动值。大致如下：

.controller('MyTabCtrl', function($scope, $routeParams) {
  $scope.tabs[$routeParams.active].active = true;
})

其中URL将是

/？active=title4

您还需要设置$routeProvider服务。

---

一旦JSFIDLE再次可用（目前速度太慢了…）问题得到解决，您需要使用ui的基本概念。默认情况下，引导第一个选项卡将处于活动状态

Html代码：

<div ng-controller="MyTabCtrl">
    <tabset>
        <tab heading="title1">{{tabs.title1.content}}</tab>
        <tab heading="title2">{{tabs.title2.content}}</tab>
        <tab heading="title3">{{tabs.title3.content}}</tab>
    </tabset>
</div>

---

工作示例：

的可能重复项。一个bug被归档了：复制品被当场发现。见@Thomas的答案副本。而且，这似乎是最终的解决办法（至少对我来说）。

angular.module("myApp", ['ui.bootstrap']).
controller("MyTabCtrl", function($scope) {
    $scope.panes = [
        {title:"First", content:"Hello world!"},
        {title:"Second", content:"Bonjour monde!"},
        {title:"Second", content:"Bonjour monde!"}
    ];
    $scope.tabs = {
        title1: {content:"Hello world 1!"},
        title2: {content:"Hello world 2!"},
        title3: {content:"Hello world 3!"}
    }
  // $scope.tabs.active = true;
});