Отображение числа с двумя десятичными знаками при вводе числа

Question

У меня есть входные данные от min: 0 до max: 1. Значение по умолчанию - 1. Однако мне нужно, чтобы он отображался как 1,00. Как я могу это сделать?

Введите html:

<input id="scale"
       name="scale"
       class="ui-g-9"
       type="number"
       [min]="0"
       [step]="0.01"
       [max]="1"
       [required]="true"
       [(ngModel)]="product.scale" <!-- this default value is 1.00 -->
       placeholder="Enter the scale">

Answer 1

Исправлено с помощью @ViewChild в компоненте для получения ссылки на элемент ввода:

export class Component implements AfterViewChecked {
    @ViewChild('scale') scaleInput;

    /**
     * Angular after view checked handler
     */
    ngAfterViewChecked(): boolean {
        // Display the default value: 1 with 2 decimal places: 1.00
        this.scaleInput.nativeElement.value = parseFloat(this.scaleInput.nativeElement.value).toFixed(2);

        return super.ngAfterViewChecked();
    }
}

Где теперь ввод html:

            <input #scale <!-- IMPORTANT PART -->
                   id="scale"
                   name="scale"
                   class="ui-g-9"
                   type="number"
                   (input)="setTo2FractionalDigits($event)"
                   [min]="0"
                   [step]="0.01"
                   [max]="1"
                   [required]="true"
                   [(ngModel)]="ivcProduct.scale"
                   placeholder="Enter the scale">

Answer 2

Шаг 1: Отредактируйте ваш тег ввода

<input id="scale"
       name="scale"
       class="ui-g-9"
       type="number"
       onchange="setTwoNumberDecimal"
       [min]="0"
       [step]="0.01"
       [max]="1"
       [required]="true"
       [(ngModel)]="(product.scale).toFixed(2)" <!-- this default value is 1.00 -->
       placeholder="Enter the scale">

Шаг 2: Напишите метод setTwoDecimalPlace

function setTwoNumberDecimal(event) {
    this.value = parseFloat(this.value).toFixed(2);
}