如何在锚标记上添加和删除样式类

时间:2018-09-19 09:34:16

标签: css angularjs html5

我正在努力在锚标记上添加和删除样式类。我想在单击该标签时添加一个活动的班级,并从上一个活动班级中删除活动班级。默认情况下,主页将处于活动状态。我尝试了很多事情,但没有成功!

我添加了一些代码,但是没有用。下面是代码:

angularjs代码:

$scope.isActive = false;
        $scope.getCSSClass = function () {
                return 'active';
            }

<div id="mySidenav" class="sidenav">
    <span class="whitelogo"><img src="styles/images/logo-small.png" alt="logo"></span>
    <div class='clearfix'></div>
    <a href="javascript:void(0);" class="closebtn" ng-click="closeNav()">&times;</a> 
    <a ng-link="['/Home/']" title="Home" class="active"><i class="fas fa-home"></i>Home</a> 
    <a ng-link="['/TestForm/']" ng-class="getCSSClass()" title="Application Form"><i class="fas fa-user-edit"></i> test Form</a> 

</div>

任何帮助将不胜感激。预先感谢!

1 个答案:

答案 0 :(得分:0)

在Angularjs文件上,我添加了以下代码:

$scope.getStyleClass = function (path) {
            var cur_path = $location.path().substr(0, path.length);
            if (cur_path == path) {
                if ($location.path().substr(0).length > 1 && path.length == 1)
                    return "";
                else
                    return "active";
            } else {
                return "";
            }
        }

在HTML方面:

ng-class="getStyleClass('/TestForm')"