AngularUI Bootstrapのタブを動的に設定する（ui.bootstrap.tabs）

Question

私はAngularUI Bootstrapのtabsディレクティブを動的に生成されたタブで使用しています。

<div ng-controller="TabsDemoCtrl"> 
<uib-tabset active="activeForm"> 
    <uib-tab index="$index" ng-repeat="tab in tabs" > 
    <uib-tab-heading>{{tab.title}}</uib-tab-heading> 
    {{tab.content}} 
    </uib-tab> 
</uib-tabset> 

タブの配列が変更されるとUIのタブはそれに応じて改正されますが、アクティブなタブが設定されていない（私は明示的にコントローラにで設定するのですが）

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ngSanitize', 'ui.bootstrap']); 
angular.module('ui.bootstrap.demo').controller('TabsDemoCtrl', function ($scope, $window) { 
    $scope.tabs = [ 
    { title:'Dynamic Title 1', content:'Dynamic content 1' }, 
    { title:'Dynamic Title 2', content:'Dynamic content 2' }, 
    { title:'Dynamic Title 3', content:'Dynamic content 3' }, 
    { title:'Dynamic Title 4', content:'Dynamic content 4' } 
    ]; 

    $scope.changeTabs = function(){ 
     $scope.tabs = [ 
     { title:'Dynamic Title 5', content:'Dynamic content 5' }, 
     { title:'Dynamic Title 6', content:'Dynamic content 6' } 
    ]; 
    $scope.activeForm = 0; //Not working, how can I select tab dynamically? 
    }; 

    $scope.model = { 
    name: 'Tabs' 
    }; 
}); 

誰が言うことができます私は何が欠けている？

Plunkerについてはこちらを参照してください：あなたが$タイムアウト中のActiveFormの設定をラップする必要があり、事前 でhttps://plnkr.co/edit/Ow7Cd1eidCgaLNOhX1Vl

おかげでポール

Answer 1

：

$timeout(function(){ 
    $scope.activeForm = 0; 
}); 

これは既知の問題です - https://github.com/angular-ui/bootstrap/issues/5805

plunkr

Answer 2

ちょっとここにあるコードは、このサイクルを消化トリガすると、コードが

に動作します

$timeout(function(){ 
$scope.activeForm = 0; //Not working, how can I select tab dynamically? 
},0); 

を変更する必要があります