angular - 将逗号分隔的千位添加到 Angular2 中的数字输入

Question

在 Angular 2 中，我如何为数字输入控件添加千位分隔符，例如

模型 1000 中的值

当光标不在输入控件中时显示分隔符(例如1,000)

在输入控件中编辑值(即光标在控件内)时，应删除逗号以方便编辑值

谢谢

Answer 1

试试这个解决方案，这将解决您的问题。注意:在堆栈溢出代码段中不起作用

<input
      type="text"
      name="product_price"
      [(ngModel)]="product_price"
      autocomplete="off"
      (keydown)="numberCheck($event)"
      (keyup)="CommaFormatted($event)"
    />

CommaFormatted(event) {
 // skip for arrow keys
 if(event.which >= 37 && event.which <= 40) return;

 // format number
 if (this.product_price) {
  this.product_price = this.product_price.replace(/\D/g, "")
    .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
 }}

numberCheck (args) {
if (args.key === 'e' || args.key === '+' || args.key === '-') {
  return false;
} else {
  return true;
}}