Question

您不太了解angularjs。在页面加载时，我基于true/false将范围值定义为location.hash。

if(location.hash=='#en'){
        $scope.selectedLang=true;
    }
    else{
        $scope.selectedLang=false;
    }

当selectedLang为真时，我需要向a中的li元素添加活动类。当slectedLang为假时，我需要删除a元素中的活动类。

<li><a href="#eng" >english</a></li>
   <li><a href="#hin" >hindi</a></li>

默认情况下，selectedLang应该为true。如何获取？有任何帮助吗？

Answer 1

您需要像这样使用ng-class，

<li><a href="#eng" ng-class="{'active' : selectedLang}">english</a></li>
<li><a href="#hin" ng-class="{'active' : !selectedLang}">hindi</a></li>

如果您想直接使用样式而不是类，则需要这样使用

<li><a href="#eng" ng-style="{ color :  selectedLang ? 'blue' : '#ddd', background: selectedLang ? 'red' : '#fff'}">english</a></li>
<li><a href="#hin" ng-style="{ color :  selectedLang ? 'blue' : '#ddd', background: selectedLang ? 'red' : '#fff'}" >hindi</a></li>

并默认设置selectedLang = true

$scope.selectedLang=true;
if(location.hash != '#en'){
    $scope.selectedLang=false;
}

Answer 2

您可以将ng-class用作三元运算符

<a href="#eng" ng-class="selectedLang ? 'active' : ''">english</a>

Reference

根据作用域值添加和删除活动类

2 个答案: