我有一个按钮,我想应用按钮的默认样式,当用户单击按钮时,将按钮样式颜色更改为红色,将背景颜色更改为白色。 Blow 是我的 .css 和组件。
.btn-default {
color: white;
background-color: blue;
}
.btn-change {
color: Red;
background-color: white;
}
组件.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
bntStyle: string;
AppComponent() {
this. bntStyle = 'btn-default';
}
submit() {
this.bntStyle = 'btn-change';
}
.html
<div>
<button name="Save" [ngClass]="['bntStyle']" (onClick)="submit()">Submit</button>
</div>
您正在绑定强“按钮样式”。相反,您应该绑定该字段:
<div>
<button name="Save" [ngClass]="[bntStyle]" (click)="submit()">Submit</button>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)