Сила 2 десятичных разряда точность ввода ионов

Question

Я хотел бы всегда отображать цифры с двух знаков после запятой точность в ионный ввод. Так что:

1.01 
1.10 
1.20 
1.23 

НЕ отображается как: 1.1 и 1.2, но выглядят как 1,10 и 1,20

Моя модель:

export class HomePage { 
    public myValue:number; 
} 

с HTML файл следующим образом:

<ion-content padding> 
    <h3>Hello</h3> 
    <ion-row margin-right="50px" margin-left="50px"> 
     <ion-input type="number" ng-pattern="/^[0-9]+(\.[0-9]{1,2})?$/" step="0.01" 
       [(ngModel)]="myValue" placeholder="0.00"></ion-input> 
    </ion-row> 
</ion-content> 

Я также пробовал просто:

<ion-input type="number" step="0.01" 
        [(ngModel)]="myValue" placeholder="0.00"></ion-input> 

Он работает в веб-браузере (MacOS, 55.0.2883.95 (64-разрядная версия)), но не работает на Android (проверено на 7.1)

Любые предложения?

Answer 1

Сохраните номер как введенный и отформатируйте с помощью decimal pipe при выводе значения. Это всегда будет отображаться 2dp

{{ myValue | number:'1.2-2' }}

Если вы хотите использовать трубу внутри самого компонента, возможно, как часть логики проверки, вы можете вводить его.

import { DecimalPipe } from '@angular/common'; 
class MyService { 

    constructor(private decimalPipe: DecimalPipe) {} 

    twoDecimals(number) { 
     return this.decimalPipe.transform(number, '1.2-2'); 
    } 
} 

Примечание: Вы должны установить его в качестве provider на app.module.ts

app.module.ts

import { DecimalPipe } from '@angular/common'; 

providers: [ 
    DecimalPipe 
    ] 

Answer 2

    **HTML : **     
<ion-input type="number" [(ngModel)]="defaultQuantity" formControlName="defaultQuantity" (ngModelChange)="changeQuantity($event)"> 


    ***Function : *** 

    import { ChangeDetectorRef } from '@angular/core'; 

    export class OrderPage { 

    constructor(public cdRef : ChangeDetectorRef){} 

      changeQuantity(value){ 
        //manually launch change detection 
        this.cdRef.detectChanges(); 
        if(value.indexOf('.') !== -1) 
        { 
         this.defaultQuantity = value.substr(0, value.indexOf('.')+3); 
        } else { 
         this.defaultQuantity = value.length > 4 ? value.substring(0,4) : value; 
        } 
       } 

    } 


     **OUTPUT :** 

       1.01 
       1.10 
       1.20 
       1.23