Decimal one place input type only number Ionic 3最新版本(3.9.2)我正在使用

Question

我使用的是ionic最新版本3.9.2。我正面临着一个问题。我有一个输入框。输入类型数字，当用户在文本框中输入时，他们只允许小数点后的一个数字。并且在输入框中最多只能输入一位小数，不允许超过一位。

Examples: 
1) 1407.1
2) 6449496.8
3) 1.1

这样，只有用户可以输入十进制后的一位数字

我的Html代码

 <ion-item>
    <ion-label fixed>TECHLOG:</ion-label>
    <ion-input type="number" [ngModel]="mymodel" (ngModelChange)="onChangeTech($event)"></ion-input>
 </ion-item>

我的ts文件代码

  onChangeTech(event) {
    alert(event)
  }

在警报中，我得到了我输入的任何数字，但不知道如何在输入框中输入一个小数点后强制停止。

Answer 1

你可以使用 module.Please，试一试，让我知道。

npm i angular2-文本掩码--保存

然后，将其导入您的@NgModule：

import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { TextMaskModule } from 'angular2-text-mask';

@NgModule({
  imports: [
    FormsModule,
    TextMaskModule
  ],
  declarations: []
})
export class MyModule {}

Answer 2

这种方式不是100%正确的。它将舍入用户输入(例如，1.57 --> 1.6)。并且它不能处理错误的输入(例如，1.2.3454)。但是，这是一种快速而简单的方法。

​

let input = document.getElementById('numberInput');
input.addEventListener('keyup', (event) => {
  let value = parseFloat(input.value);
  if (value) {
    input.value = parseFloat(value.toFixed(1));
  }
})

<input type="number" id="numberInput" step="0.1" />

​