ng-class to highlight active menu item based on ng-repeat. AngularJS

Question

I have a menu based on the following example:

Answer 1

Try this out:- http://jsfiddle.net/uDPHL/146/

This issue exists in older version of angular js Reference, issue got resolved after upgrading it to angular js 1.2.0 version.

JS:-

var navList = angular.module('navList', []);    

navList.controller('navCtrl', ['$scope', '$location', function ($scope, $location) {

    $scope.navLinks = [{
        Title: 'home',
        LinkText: 'Home',
    }, {
        Title: 'about',
        LinkText: 'About Us'
    }, {
        Title: 'contact',
        LinkText: 'Contact Us'
    }];

    $scope.navClass = function (page) {
        var currentRoute = $location.path().substring(1) || 'home';
        return page === currentRoute ? 'active' : '';
    };   

}]);

HTML:-

    

        
 {{navLink.LinkText}}