Angular 2+：使用 onclick 更改属性

Question

我有一个带有 mat-raised-button 属性的按钮

<button mat-raised-button (click)="function()">My Button</button>

我想用我的函数添加或删除 mat-raised-button 属性。 有没有办法做到这一点？还是我需要更改 CSS？

Answer 1

您只需 1 个按钮即可实现此目的。

<button class="btn btn-sm" [attr.mat-raised-button]="attributeCondition ? '': null" (click)="changeAttributeCondition()">Button</button>

• 将属性设置为 null 将删除该属性
• 用空白设置属性，只需添加该属性
• 用任意值设置属性，设置属性

参考：Discussion over here

Answer 2

您可以使用两个不同的按钮，并且使用 *ngIf 根据您的情况，您一次只能显示一个。

<button mat-button (click)="function()" *ngIf="!isCondition">My Button</button>
<button mat-raised-button (click)="function()" *ngIf="isCondition">My Button</button>

希望对您有所帮助。