[英]how to add decimal in angular reactive form control with value starting with 1 and greater
I want to add a decimal and then 0 after 1 like 1.0我想添加一个小数,然后在 1 之后添加 0,例如 1.0
<input type="number" formControlName="global_velocity_weight" />
this.form = this.fb.group({
global_velocity_weight: new FormControl(1.0, { validators: [Validators.required] })
})
But it is not working and in the input, only 1 is shown.但它不起作用,在输入中,只显示 1。
you can achieve this using angular DecimalPipe
inside your form template.您可以在表单模板中使用 angular DecimalPipe
来实现这一点。
<form [formGroup]="myForm">
<input
[value]="myForm.get('global_velocity_weight').value | number" // here you pipe the value
formControlName="global_velocity_weight"
...
>
</form>
You should make some regular expression to accept numeric values:您应该制作一些正则表达式来接受数值:
<input type="number" formControlName="global_velocity_weight" />
this.form = this.fb.group({
global_velocity_weight: new FormControl(1.0, { validators:
[Validators.required,Validators.pattern('^[0-9]+(.[0-9]{0,1})?$')] })
})
I think your best shot would be to apply a mask to the input field.我认为您最好的办法是在输入字段中应用蒙版。 I know of a library ( https://github.com/JsDaddy/ngx-mask ) that allows you to do so and I believe it's supported from Angular 5 up.我知道一个库( https://github.com/JsDaddy/ngx-mask )允许你这样做,我相信它从 Angular 5 开始支持。
A mask is a specification of what the input should look like, like yyyy/mm/dd
you see often for date inputs.掩码是输入应该是什么样子的规范,例如您经常看到的日期输入的yyyy/mm/dd
。 You can also use this to specify how a number input field should look like and indicate the appearance of decimals.您还可以使用它来指定数字输入字段的外观并指示小数的外观。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.