angular - 如何动态更改 Angular 6 中使用的类中的样式？

Question

目前，我已经可以使用 ng-container 更改按钮的设计。该代码片段如下。

  <ng-container *ngIf="isDisabled;">
        <button class="bot-btn-disabled"
                (click)="confirm()"
                [disabled]=this.isDisabled >
          Confirm
        </button>
  </ng-container>

  <ng-container *ngIf="!isDisabled;">
    <button class="bot-btn"
            (click)="confirm()"
            [disabled]=this.isDisabled >
      Confirm
    </button>
  </ng-container>

但是，这似乎很长，因为我只需要更改按钮的 class="bot-btn"，如果 isDisabled = false，它将更改为 bot-btn 的样式，反之亦然。有没有什么办法可以用更短的方式做到这一点？

Answer 1

您可以根据如下条件在按钮上设置class:

[ngClass]="this.isDisabled ? 'bot-btn-disabled' : 'bot-btn'"