Question

当我只有一个条件时，即'e-card horCard card-OK': var1 == 0 ng多班工作。当我在下面有其他条件时，使用与条件第一部分相同的类'e-card horCard card-NOK': var1 > 0，则根本不应用它们。这是什么问题？

  <div [ngClass]="{'e-card horCard card-OK': var1 == 0, 'e-card horCard card-NOK': var1 > 0}">
      <div class="card-header">{{'SitesWithProblem' | translate | uppercase}}</div>
      <div class="card-data">{{globalStatistic.TotalSitesWithProblem}}</div>
    </div>

Answer 1

您在两种情况下都使用相同的类，因此对于第二种情况，它只显示与第一种情况不同的类，因此请按以下方式仅按条件使用所需的类

<div class="e-card horCard " [ngClass]="{' card-OK': var1 == 0, 'card-NOK': var1 > 0}">
  <div class="card-header">{{'SitesWithProblem' | translate | uppercase}}</div>
  <div class="card-data">{{globalStatistic.TotalSitesWithProblem}}</div>
</div>

OR

<div class="e-card horCard " [ngClass]="(var1 == 0)? 'card-OK' : 'card-NOK'">
  <div class="card-header">{{'SitesWithProblem' | translate | uppercase}}</div>
  <div class="card-data">{{globalStatistic.TotalSitesWithProblem}}</div>
</div>

使用ngClass的多类-Angular 6

1 个答案: