I have an input field below , what I want to happen is that it should always display the input value in 2 decimal places , if I input 1 , it will show 1.00 in the input field , how do we do that using the formcontrol ? cause I am not using ngmodel. Thanks.
I tried using mask="separator.2 but it does not work. Thanks for any idea ang help
#html code
<mat-form-field appearance="fill">
<mat-label>Acres</mat-label>
<input mask="separator.2" thousandSeparator="," matInput formControlName="acres" placeholder="">
</mat-form-field>
#ts code
private _createModelForm(): FormGroup {
return this.formBuilder.group({
acres: this.model.acres
});
}
If you're using reactive forms and you're patching a value, you need to patch the value you want to HTML to render.
You can use Angular's DecimalPipe in TypeScript:
import { DecimalPipe } from '@angular/common';
export class Mycomponent {
constructor(private decimalPipe: DecimalPipe) {}
private _createModelForm(): FormGroup {
return this.formBuilder.group({
acres: this.transformDecimal(this.model.acres)
});
}
transformDecimal(num) {
return this.decimalPipe.transform(num, '1.2-2');
}
}