• Активный пункт меню в Angular?

    baskerville42
    @baskerville42
    Учусь работать (Junior)
    Вот код для стандартного ngRoute

    <ul>
        <li ng-repeat="link in menu" ng-class="{ active: isActive(\'{{ link.href }}\') }">
            <a ng-href="{{ link.href }}" href="">{{ link.title }}</a>
        </li>
    </ul>


    В контроллер нужно заинжектить следующие сервисы: $scope, $location
    $scope.menu = [{
        "title": "title1",
        "href": "href1"
    }, {
        "title": "title2",
        "href": "href2"
    }, {
        "title": "title3",
        "href": "href3"
    }];
    
    $scope.isActive(location) {
        return location === $location.path()
    }


    Логика такая, при nrRepeat вы каждый раз стучитесь в функцию isActive передавая ей в качестве аргумента ссылку, которая используется в меню. Функция сверяет текущий url с тем что вы ей передали и возвращает true или false. Далее ngClass подставляет класс active там, где функция isActive вернула true.
    Ответ написан
    5 комментариев