javascript - 在 ng-class 中删除和添加类

Question

有一些元素包含一个像三元运算符一样工作的 ng 类:

ng-class="$ctrl.something ? 'fa-minus' : 'fa-plus'"

例如，为了访问它们，可以将所有具有fa-minus 的元素存储到一个列表中:

const elementList = document.querySelectorAll('.fa-minus');

我的问题是是否可以在 ng 类内部进行修改。例如，对于所有具有fa-minus的元素，将其更改为fa-square。

之后我尝试了几种方法，例如删除和添加类:

    const elementList = document.querySelectorAll('.fa-minus');
    document.forEach(document=> document.classList.remove('.fa-minus'));
    document.forEach(document=> document.classList.add('fa-square'));

它不起作用，可能是因为原始的是 ng 类而不是经典的 css 类。

它不应该改变原来的 ng-class。我只想在创建导出文件的函数中更改它

有办法解决吗？

Answer 1

在使用 AngularJS 时避免直接操作 DOM。您可以使用以下代码以 Angular 方式执行此操作。

HTML

ng-class="$ctrl.getClass()"

Controller

var $ctrl = this;
var MINUS = 'fa-minus';
var PLUS = 'fa-plus';

getClass () {
   return $ctrl.something ? MINUS : PLUS
}

changeMinusClass(newClass) {
   MINUS = newClass
}

onClickOfSomething () {
   this.changeMinusClass('fa-square')
}