输入 onChange 后设置图标
set icon after input onChange
我想在输入字段后添加图标,它会在更改时显示。
和另一个图标,如果它没有聚焦。
谁能帮帮我
我试过类似下面的东西,但我不知道如何切换图标。
<input matInput type="text" style="width: 200px;">
<button mat-mini-fab style="float: right;" color="primary" (click)="element.disabled = !element.disabled">
<mat-icon>{{element.disabled ? 'home' : 'edit'}}</mat-icon>
</button>
谢谢
我找到了方法。
在 .ts 文件中定义两个布尔值 variables.and 改变输入元素的焦点和焦点离开事件的值。
home: boolean = false;
edit:boolean = true;
onFocusOutEvent(event: any){
// toggle as you want to use it.
}
onFocusEvent(){
// toggle as you want to use it.
}
在HTML文件中
<input matInput type="text" [formControlName]="element.id" (focusout)="onFocusOutEvent($event)" (focus)="onFocusEvent($event)" >
<button style="float: right;" color="primary" *ngIf="edit">
<mat-icon>edit</mat-icon>
</button>
<button *ngIf="home" style="float:left;">
<mat-icon>home</mat-icon>
</button>
我希望它对某人有帮助。谢谢
我想在输入字段后添加图标,它会在更改时显示。 和另一个图标,如果它没有聚焦。
谁能帮帮我 我试过类似下面的东西,但我不知道如何切换图标。
<input matInput type="text" style="width: 200px;">
<button mat-mini-fab style="float: right;" color="primary" (click)="element.disabled = !element.disabled">
<mat-icon>{{element.disabled ? 'home' : 'edit'}}</mat-icon>
</button>
谢谢
我找到了方法。
在 .ts 文件中定义两个布尔值 variables.and 改变输入元素的焦点和焦点离开事件的值。
home: boolean = false;
edit:boolean = true;
onFocusOutEvent(event: any){
// toggle as you want to use it.
}
onFocusEvent(){
// toggle as you want to use it.
}
在HTML文件中
<input matInput type="text" [formControlName]="element.id" (focusout)="onFocusOutEvent($event)" (focus)="onFocusEvent($event)" >
<button style="float: right;" color="primary" *ngIf="edit">
<mat-icon>edit</mat-icon>
</button>
<button *ngIf="home" style="float:left;">
<mat-icon>home</mat-icon>
</button>
我希望它对某人有帮助。谢谢