Question

我有这个按钮：

<button class="btn btn-primary btn-sm" (click)="addSupplier(item)">Save</button>

我想添加一个“禁用”类，它只会在某个条件为真时应用，并且在它为假时不会应用。

Angular 2的做法是什么？我使用* ngIf想出了这种方法，但这是一大堆代码：

<div *ngIf="item.productId && item.supplier">
    <button class="btn btn-primary btn-sm" (click)="addSupplier(item)">Save</button>
</div>
<div *ngIf="!item.productId || !item.supplier">
    <button class="btn btn-primary btn-sm disabled" (click)="addSupplier(item)">Save</button>
</div>

Answer 1

<button class="btn btn-primary btn-sm" [class.disabled]="!item.productId || !item.supplier" (click)="addSupplier(item)">Save</button>

Answer 2

Angular 2中仍然提供了良好的旧ngClass。如果需要，可以尝试一下。

[ngClass]="{'my-class': isClassVisible }"

Answer 3

如果您只是想尝试禁用该按钮，则可能不需要css类，请绑定[disabled]，如[disabled]="disableButton"

Angular 2将条件类添加到HTML标记的方法

3 个答案: