Angular-UI Tabs: add class to a specific tab

Question

I want to create the following tabs with Angular UI:

_{(source: gyazo.com)}

So, I\'m adding the styles based on Bootstap\'s class names/markup:

Answer 1

I had the same problem today and got around it in a slightly hacky way. Whenever I determined that a specific tab needed a class added/removed from it, I simply used angular selectors to select my tab, and dynamically added/removed classes manually.

HTML

  



JS
var errorTab = angular.element('.errorTab');
if($scope.explorer.hasError){
  errorTab.addClass('showErrorTabClass');
  errorTab.removeClass('hideErrorTabClass');
}
else{
  errorTab.addClass('hideErrorTabClass');
  errorTab.removeClass('showErrorTabClass');
}