如何在材质中隐藏占位符onclick [英] How to hide placeholder onclick in material
本文介绍了如何在材质中隐藏占位符onclick的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用简单的form-field input
组件,如以下代码所示
I am using simple form-field input
component as in below code
<mat-form-field class="example-form-field" >
<input matInput type="search" placeholder="Search" >
</mat-form-field>
在默认情况下,输入的内容为Fiel时,占位符将位于上方.
On entering the input fieled by default the placeholder will go above.
在输入字段时如何隐藏占位符?
How can i hide the placeholder on entering to the input field?
推荐答案
您可以尝试:
DEMO ----> 解决方案
DEMO ----> Solution
您也可以为相同的内容创建指令
You can also create Directive for same
您可以根据需要替换(单击)---->(焦点)
You can replace (click) ----> (focus) as you need
<mat-form-field floatLabel=never>
<input (click)="checkPlaceHolder()" (blur)="checkPlaceHolder()" matInput placeholder=" {{myplaceHolder}} ">
</mat-form-field>
在TS中:
myplaceHolder: string ='Enter Name'
checkPlaceHolder() {
if (this.myplaceHolder) {
this.myplaceHolder = null
return;
} else {
this.myplaceHolder = 'Enter Name'
return
}
}
这篇关于如何在材质中隐藏占位符onclick的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文