[英]Allow only one decimal on input in Angular2
This is my input: 这是我的意见:
<input [(ngModel)]="minimumRange" min="1" placeholder="0.0" step="0.1" type="number">
What I need is, when someone enters 我需要的是,当有人进入时
"1"
“1”
, I need it to return ,我需要它回来
"1.0".
“1.0”。
on blur How is this possible? on blur这怎么可能?
Using the number @Pipe
you should be able to achieve this. 使用数字
@Pipe
你应该能够实现这一目标。
<input [ngModel]="minimumRange | number : '1.1-2'" min="1" (ngModelChange)="minimumRange=$event" placeholder="0.0" step="0.1" type="number">
For more info: 欲了解更多信息:
Hope it helped! 希望它有所帮助! Good coding bro!
好编码兄弟!
Update: 更新:
If we use @Pipe in model like this: 如果我们在模型中使用@Pipe,就像这样:
<input [(ngModel)]="myModel| uppercase">
It will throw the following error: 它会抛出以下错误:
Parser Error: Cannot have a pipe in an action expression at column X
分析器错误:在X列的动作表达式中不能有管道
We will just need to change it to this: 我们只需将其更改为:
<input [ngModel]="myModel| uppercase" (ngModelChange)="myModel=$event">
Update2: UPDATE2:
Added (ngModelChange)="minimumRange=$event"
to keep the two way binding functionality. 添加了
(ngModelChange)="minimumRange=$event"
以保持双向绑定功能。
As @n00dle pointed me, removing the ()
removes the 2 way binding functionality. 正如@ n00dle指出的那样,删除
()
会删除双向绑定功能。 So the way to use @Pipe
in a 2-way-binding would be using also (ngModelChange)
. 因此,在双向
@Pipe
中使用@Pipe
的方法也是使用(ngModelChange)
。
This could be of huge use: 这可能是一个巨大的用途:
try this 尝试这个
<input [(ngModel)]="minimumRange" min="1" placeholder="0.0" step="0.1" type="number" (keyup)='conversion()'>
conversion(){
this.minimumRange = this.minimumRangex.toPrecision(2);
}
private _minimumRange:number; get minimumRange():number{ return this._minimumRange; } set minimumRange(num:number){ this._minimumRange = num.toPrecision(2); }
<input [(ngModel)]="minimumRange" min="1" placeholder="0.0" step="0.1" type="number">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.