Skip to content

Instantly share code, notes, and snippets.

@IsaiahPacheco
Last active August 29, 2015 14:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save IsaiahPacheco/375ea34fbda98203efe3 to your computer and use it in GitHub Desktop.
Save IsaiahPacheco/375ea34fbda98203efe3 to your computer and use it in GitHub Desktop.
Sets anchor tag class to "active" when href attribute matches current $location.path() only using jqLite methods
// JQuery Optional, built with Angular jqLite methods only
// HTML example use
// <ul nav-tabs>
// <li><a href="/absolute/or/relative path"> Menu Item </a></li>
// </ul>
app.
directive('navTabs', ['$location',
function ($location) {
return {
restrict: 'A',
link: function(scope, element) {
var tabs = element.children(),
tabMap = {};
for(var i = 0; i < tabs.length; i ++) {
var li = angular.element(tabs[i])
tabMap[li.find("a").attr('href')] = li;
};
scope.$on('$locationChangeSuccess', function() {
element.find("li").removeClass("active");
tabMap[$location.path()].addClass("active");
});
}
}
}]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment