Determining Active Tab Number as String

[rhudd]

Regarding this post: Determining Active Tabs  

Using the proposed solution, when a button is pressed, I would like a label to display the current active tab number.

My attempt is below but this currently isn't working. Any advice would be appreciated. 

$scope.buttonPress = function(){
  var tabID = $scope.testClickTab();
  $scope.setWidgetProp( "label-9", "text", tabID);
}


$scope.testClickTab=function(key) {
	angular.forEach( 
   	$element.find('twx-tab'), function(value, key) {
      if(value['style']['display']=='block') console.error(key); 
 } )
};

[tincescu · Accepted solution]

// $scope, $element, $attrs, $injector, $sce, $timeout, $http, $ionicPopup, and $ionicPopover services are available



function isHidden(el) {
    return (el.offsetParent === null)
}


angular.element(document).ready(function () {

	//$scope.ShowTabState();  

});


$scope.ShowTabState = function() {
    var tabs = document.getElementsByClassName("tab");
  	for(i=0; i<tabs.length; i++) {      	
        if(isHidden(tabs[i]) == false) {
          	$scope.app.view.Home.wdg["label-1"].text = "Current Tab " + i;
        }    
    }
}

Is this the behaviour you want?

[tincescu]

My approach is this.

We check in the ShowTabState what elements with the class tab are visible on the screen (in our case it will be always one). 

Then we call this funtion when the button is pressed.

[rhudd]

Hi @tincescu ,

Yes, that's exactly what I'm looking for, thank you very much 😁

Also, I appreciate the video, it helps to make communication clear and is a nice touch 🙂

For clarity, should anyone else use this approach, 'tab' is entered as the class for each individual tab, not for the tab object as a whole. I made this mistake initially.

Many thanks