Question

我有2个链接EN和FR（英语和法语）

<label  class = "lang" id="en"><a href=""  ng-click="c.changedLang('en');" ng-class=" eng ? active:'' ">EN </a>
                </label>
                <label>||
                </label>
                <label  class = "lang" id="fq"><a href=""  ng-click="c.changedLang('fq');" ng-class=" fren ? active:'' ">FR</a>
                </label>

当点击EN链接的活动班级应添加为英语时，当将FR链接单击的活动班级添加到法语时。

页面加载活动课程已添加到英语。我正在基于location.hash进行学习。

客户端脚本

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

CSS

.active{
color:#fff;
}

我的代码有什么问题吗？活动类未正确添加。

Answer 1

您的ng-class陈述有误。 ng-class需要一个数组或对象作为输入。将它们更改为以下内容，以便它们获得预期的输入：

ng-class="{'active': eng}"

和

ng-class="{'active': fren}"

这里有个简单的方法可以帮助您入门：http://plnkr.co/edit/6l9C0lQISlTVxcIpumQI

Answer 2

您可以通过更新代码来实现此目的，

HTML

<label class="lang" id="en">
    <a href="" ng-click="locale = 'en'" ng-class="{'active': locale == 'en'}">EN </a>
</label>
<label class="lang" id="fq">
    <a href="" ng-click="locale = 'fr'" ng-class="{'active': locale == 'fr'}">FR</a>
</label>

要设置默认语言环境，可以将$ scope.locale的值设置为'en'或'fr'

切换活动类-角度js

2 个答案: