Angular форма ввода только с двумя десятичными знаками?

Question

У меня есть ввод, подобный следующему:

<mat-form-field>
    <input matInput type="number" [placeholder]="'Hours' | translate"
                formControlName="Work" (blur)="calculate()" />
</mat-form-field>

Прямо сейчас, ввод допускает неограниченное количество знаков после запятой. Я хотел бы разрешить только 2 десятичных знака на этом входе. Это можно сделать с помощью любого из следующих решений:

• Ограничить ввод до 2 десятичных знаков, чтобы я не мог вставить больше
• Разрешить неограниченное количество десятичных знаков и округлить до 2 десятичных знаков, когда Я щелкаю по другому компоненту

Есть ли в Angular какая-либо включенная функция для этого? В противном случае, как я могу создать это ограничение / округление?

Пример второй опции:

1. Пользователь вводит значение 1,2582399512

2. Когда вход не сфокусирован, значение округляется до 1,26

Answer 1

ПОПРОБУЙТЕ:

validation(e: any) {
    let input = String.fromCharCode(e.charCode);
    const val = /^\d*(?:[.,]\d{1,2})?$/;
    if (!reg.test(input)) {
      e.preventDefault();
    }
}

Answer 2

Я не уверен, что это решение будет округлено, но свойство "step" может помочь вашему случаю:

<mat-form-field>
<input matInput type="number" [placeholder]="'Hours' | translate"
            formControlName="Work" (blur)="calculate()" step=".01"/>
</mat-form-field>

Это позволит ввести больше значений, но даст ошибку, если будет превышено 2 десятичных знака. Надеюсь, это поможет.