typescript - Poate ngClass să folosească operatorul ternar în Angular 2?

În Angular 1, codul de mai jos funcționează bine.

<div ng-class="$varA === $varB ? 'css-class-1' : 'css-class-2'">

Dar când încerc să fac un lucru similar în Angular 2, nu funcționează.

Am adăugat deja directives: [NgClass]

<div [ngClass]="varA === varB ? 'css-class-1' : 'css-class-2'">

Cum ar trebui să scriu în Angular 2, mulțumesc!

EDIT: A fost greșeala mea, am adăugat din greșeală { } la tot varA === varB ? 'css-class-1' : 'css-class-2'. Deci ngClass poate folosi în continuare operatorul ternar în Angular 2.

Răspuns #1

Da. Ceea ce ai scris funcționează:

<div [ngClass]="varA === varB ? 'css-class-1' : 'css-class-2'">

Plunker

Rezultatul expresiei din partea dreaptă trebuie să evalueze la unul dintre următoarele:

• un șir de nume de clase CSS separate prin spațiu (acesta este ceea ce returnează expresia ta)
• un șir de nume de clase CSS
• un obiect, cu numele claselor CSS ca chei și valori booleene

Poate ai avut o altă eroare în codul tău?

Răspunsul #2

<div [ngClass]="{'css-class-1':varA === varB, 'css-class-2': varA !== varB}">

Vezi de asemenea https://angular.io/api/common/NgClass

Răspunsul #3

Poți încerca următoarele.....

Pentru operatorul ternar folosește:

[ngClass]="condition1==condition2?'class-1':'class-2'"

Pentru mai multe condiții folosiți:

[ngClass]="{'class-1':condition1==condition2, 'class-2': condition3==condition4}"

mulțumesc...