我想在离子输入中始终显示精确到两位小数的数字.以便：
1.01 1.10 1.20 1.23
我的模型是：
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>
它适用于Web浏览器(MacOS,55.0.2883.95(64位)),但不适用于Android(在7.1上测试)
有什么建议？
解决方法
存储输入的数字,并在输出值时使用
decimal pipe格式化.这将始终显示2dp
{{myValue |号码：’1.2-2′}}
如果您想在组件本身内使用管道,可能作为验证逻辑的一部分,您可以注入它.
import { DecimalPipe } from '@angular/common';
class MyService {
constructor(private decimalPipe: DecimalPipe) {}
twoDecimals(number) {
return this.decimalPipe.transform(number,'1.2-2');
}
}
注意：您需要将其设置为app.module.ts上的提供程序
app.module.ts
import { DecimalPipe } from '@angular/common';
providers: [
DecimalPipe
]
