Ionic 3输入百分比掩码

Question

我想听听有关如何完成此操作的任何建议或建议。要求是创建一个输入掩码指令，该指令只允许用户输入数字，可选2位小数，并且在输入字段内还有％符号。任何想法，或者如果有什么已经为此建成将非常感激， 在此先感谢！

Answer 1

跟着山姆的建议，用文字面罩解决：

<input type="tel" [(ngModel)]="percent" 
[textMask]="{mask: mask, pipe: percentage, guide:false}" /> 

和..

mask(obj) { 
    return [ /\d/, /\d|./, /\d|./, /\d/, /\d/ ]; 
}; 

percentage(value) { 
    var num = value.replace('%', ''); 
    if (isNaN(num)) { 
     if (num % 1 != 0) { 
      num = parseFloat(num).toFixed(2); 
     } 
     return num + '%'; 
    } else { 
     return false; 
    } 
} 

Answer 2

希望你可以使用text-mask模块。

但是您需要安装Ionic 3兼容版本，如下所示。

npm install angular2-text-mask@8.0.2 --save 

变化package.json如下（即除去^）

"angular2-text-mask": "8.0.2", 

这module有很多特征。看到上面的链接。

更新：如果你使用Lazy loading则必须导入TextMaskModule要么page's module或shared.module.ts里面，你也需要设置在ion-input的maxlength，以避免将出现在blur event多余的字符。