получить индекс активной вкладки

Question

Я хотел бы получить индекс активной вкладки в стороне js, но я понятия не имею, как это сделать, я пробовал несколько вещей, но все, что у меня было, было «неопределенным» или еще хуже: пустую страницу.

вот мой код:

HTML:

<uib-tabset> 
    <uib-tab ng-repeat="item in tabs" active="item.active" TabIndex="{{item.id}}" heading="{{item.name}}"></uib-tab> 
</uib-tabset> 

ЯШ:

Category.findAll().$promise.then(function (result) { 
     $scope.tabs = result; 
    }); 

Вот скриншот, чтобы показать вкладки после обедает страницу:

Я хочу получить индекс: 4 или 3 (TabIndex = "{{item.id}}") на моей стороне js, onchange, но также и при загрузке страницы.

Я надеюсь, что кто-то может мне помочь.

Извините за мой английский, это не мой родной язык.

Answer 1

Вы можете связать переменную область, чтобы active свойство uib-tabset компонента:

<uib-tabset active="activeTab"> 
    <uib-tab ng-repeat="item in tabs" active="item.active" TabIndex="{{item.id}}" heading="{{item.name}}" select="alertMe($event, $index)></uib-tab> 
</uib-tabset> 

и в контроллере вы можете выбрать вкладку или просто прослушивание событий смены вкладок:

Category.findAll().$promise.then(function(result) { 
    $scope.tabs = result; 
    $scope.activeTab = 1; //set 2nd tab 

    $scope.$watch('activeTab', function(newVal) { 
     console.log(newVal); //listen to tab change events 
    }); 

}); 

См. Это fiddle, если вам нужно.

Answer 2

select() - Необязательное выражение, называемое при активации вкладки. Поддерживает $ event в шаблоне для выражения.

<uib-tabset> 
    <uib-tab ng-repeat="item in tabs" active="item.active" TabIndex="{{item.id}}" heading="{{item.name}}" select="alertMe($event, $index)></uib-tab> 
</uib-tabset> 

alertMe функция внутри контроллера

$scope.alertMe = function(e, index) { 
    console.log(e, index) 
};