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>

希望有所帮助。