AngularJS在ng-click上更改类名的方法

Question

我知道在AngularJS应用程序中不使用jQuery是一种很好的做法，但是努力解决AngularJS这样做的方法：

$scope.clickEvent = function(event) {
    if($(event.target).hasClass('icon-closed')) {
        $(event.target).removeClass('icon-closed')
        $(event.target).addClass('icon-opened')
    } else {
        $(event.target).removeClass('icon-opened')
        $(event.target).addClass('icon-closed')
    }
}

我的HTML：

<div class="component-title icon-closed" 
     ng-model="collapsed" 
     ng-click="collapsed=!collapsed;clickEvent($event)">{{component.name}}</div>

collapsed代码显示/隐藏面板，div位于ng-repeat循环内，因此与clickEvent函数无关。

我希望我能从事件对象＆amp;中获取类名。不使用jQuery就改变它们。有什么想法吗？

谢谢：）

Answer 1

您可以使用ngClass指令来实现此目的。

<div class="component-title"
     ng-class="{'icon-closed':collapsed,'icon-opened':!collapsed}"
     ng-model="collapsed"
     ng-click="collapsed=!collapsed">{{component.name}}</div>

有关ngClass的更多信息，请here。