在我的元素标记上添加和删除其他类

Question

我正在学习Angular.js,第一眼看到我觉得这很容易.:P.但我被困在这里.我想要的是在我的<.a>(锚)标签上添加另一个类.

我的HTML代码:

<a href="#/services" title="Services" class="scroll">
<a href="#/portfolio" title="Portfolio" class="scroll">

假设当我点击服务链接时,它会添加"启用"类

<a href="#/services" title="Services" class="scroll enabled">
<a href="#/portfolio" title="Portfolio" class="scroll">

然后,如果我点击投资组合链接,它也将添加"启用"类,并将从服务锚标记中删除启用的类

<a href="#/services" title="Services" class="scroll">
<a href="#/portfolio" title="Portfolio" class="scroll enabled">

实现这一目标的最佳方法是什么？阅读ng-click和ng-class,还有ng-class支持三元运算符？他们的文档没有说明这一点.链接

Answer 1

我也是从Angular开始,在类似的情况下我正在使用指令,请查看:

yourApp.directive('scroll', function () {        
    return {
    restrict : 'C',
        link: function(scope, element) {
            element.bind("click" , function(e){
                 $("a").removeClass("enabled"); // Here we need jQuery
                 element.addClass("enabled");
            });     
        }
    }
});

更新 Hurray,我找到了一个没有jQuery的解决方案!element的click处理程序现在看起来像这样:

element.bind("click" , function(e){
   element.parent().find("a").removeClass("enabled"); // Vanilla jqLite!
   element.addClass("enabled");
}); 

Plunker:http://plnkr.co/edit/jw16wW

Answer 2

只需将此代码添加到您的角度函数中即可删除类

angular.element(document.querySelector(".yourClass")).removeClass("yourClass");

或者

angular.element(document.querySelector("#yourSelector")).removeClass("#yourSelector");

谢谢