Angular snippet : active navigation

gistfile1.txt

  app.directive("activeNav",function($location) { 
      return {
            link: function postLink(scope, element, attrs) {
              scope.$on("$routeChangeSuccess", function (event, current, previous) {         
                  // this var grabs the tab-level off the attribute, or defaults to 1
                  var pathLevel = attrs.activeNav || 1,
                  // this var finds what the path is at the level specified
                      pathToCheck = $location.path().split('/')[pathLevel],
                  // this var finds grabs the same level of the href attribute
                      tabLink = attrs.href.split('#')[pathLevel];
                  // now compare the two:
                  if (pathToCheck === tabLink) {
                    element.addClass("active");
                  }
                  else {
                    element.removeClass("active");
                  }
              });
            }
          };
        });
        
        // add directive name to each nav element (must be <a> tag for href comparison)
        <a class="icon icon-lab" href="#portfolio" active-nav="1">Portfolio</a>