Добавление третьего условия в ngClass не работает

Question

Я пытаюсь добавить третье условие в мой ngClass.Сначала я получил следующие два класса для работы в моем ngClass, чтобы чередовать цвет строк

[ngClass]="{ totalrow:i%2 != 0, odd:i%2 == 0}"

Я пытаюсь добавить 3-й класс и условие, в котором в списке матов будет показана границадля верхней части элемента mat-list-item.Однако, когда я добавляю 3-е условие, оно дает мне ошибку

[ngClass]="{ totalrow:i%2 != 0, odd:i%2 == 0, borderTopClass : operator === 'fas fa-equals'}"

Я получаю следующую ошибку, которая меня смущает

Ошибка синтаксического анализатора: ожидание отсутствует: в столбце 47в [{totalrow: i% 2! = 0, нечетное: i% 2 == 0, borderTopClass: operator === 'fa fa-equals'}] в

Вот код сngFor

<div class="ng-container" *ngFor="let operator of operatorList; let i = index">
    <mat-list-item 
        fxLayoutAlign="start" 
        style="padding-left: 0px; padding-right: 0px;" 
        [ngClass]="{ totalrow:i%2 != 0, odd:i%2 == 0, borderTopClass   : operator === 'fas fa-equals'}">
            <i class="{{operator}}"></i>
    </mat-list-item>
</div>

Любая помощь приветствуется.

Answer 1

Полагаю, комментатору нужно более глубокое объяснение того, как это работает.

<div [ngClass]="{
  'is-active': condition,
  'is-inactive': !condition,
  'multiple': condition && anotherCondition,
}">

multiple класс будет применяться, когда два условия оба выполнены. Не один, а оба.

Вы можете добавить третий, как это: 'multiple': condition && anotherCondition && thirdCondition

Вот StackBlitz кода ОП, работающего так, как он ожидал, и без ошибок. Если я могу помочь больше просьб, дайте мне знать.