angular - 多个切换类

Question

在 <span> 上元素我有以下 HTML:

<span (click)="openLeft()"></span>

A @Component的方法设置一个 boolean变量:

private isOpen: boolean;
openLeft() {
    this.isOpen = !this.isOpen;
}

最后，我需要在另一个元素上设置一个类，就像我们在 jQuery 中所做的那样:

$('.collapse').toggleClass('in').toggleClass('hidden-xs').toggleClass('visible-xs');

因此，我需要根据 boolean 添加/删除多个类变量。

我怎样才能做到这一点？

Answer 1

[ngClass]="{'collapse': isOpen, 'hidden-xs': isOpen, 'visible-xs': isOpen}"

或

[ngClass]="isOpen ? ['collapse', 'hidden-xs', 'visible-xs'] : []"