[更改数值格式时，NaN显示在输入中

Question

我在垫子表格字段中输入了我的信息：

<mat-form-field style="padding-right: 10px;">
   <input matInput type="text" [ngModel]="value | formatSize" (ngModelChange)="value=+$event"; 
   placeholder="value" [ngModelOptions]="{standalone: true}">
</mat-form-field>
我的烟斗

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({name: 'formatSize'})
export class FormatSize implements PipeTransform {
  transform(value: number) {
    return value.toLocaleString();
  }
}
我的目标是显示一个这样格式化的值：

1000-> 1 000

10000-> 10000

...

我的代码的问题是，当我输入一个大于9999的值时，它在我的输入中显示NaN，而我的值在我的组件中为ǹull。

我在mat形式字段中输入：[

Answer 1

不会那样做。您必须使用某种遮罩解决方案。这是一条痛苦和苦难的道路，最受欢迎的解决方案是https://github.com/text-mask/text-mask

我经常使用它，虽然它有很多问题，但是可以使用。

Answer 2

您可以使用RegularExpression在数字中添加空格：