Angular - Is there any way to transform reactive form input with decimal pipe?

Viewed 331

I have a reactive form in which there are some numeric fields that need decimal formatting. They should be formatted as I type. Is there any way?

1 Answers

You can use value property of the input:

Component TypeScript file:

import { FormControl } from '@angular/forms';
...
public price = new FormControl('');

Component HTML file:

<mat-form-field appearance="fill">
  <mat-label>Price</mat-label>
  <input
    matInput
    [formControl]="price"
    type="number"
    [value]="price.value | number: '1.0-0'"
  />
</mat-form-field>

Working example

Related