如何使用 angular 4 个管道获取输入以显示和编辑货币
How to get an input to display and edit currency with angular 4 pipes
我的目标是拥有一个允许用户将数字编辑为货币的输入字段。例如。用户看到“$1,000”，他们可以键入“0”，编辑框显示“$10,000”。生成的数据模型是一个数字 10000。
<input type="text" name="Data" [ngModel]="Data | currency:'USD':true:'4.0-0'" (ngModelChange)="Data=$event" >
上面在编辑框中显示'$1,000'，但是当我在输入框中编辑数值时，数值不再是数字1000，而是一个字符串“$1,000”。这意味着我的数据模型来自
{ myCost: 1000 }
成为
{ myCost: ",000" }
关于正确执行此操作的任何想法？看起来我需要创建一个新函数来将货币转换回数字。这是可能的，但似乎有更好的方法。
您可以在组件中处理 ngModelChange class
(ngModelChange)="onInputValueChange($event)"
在component.ts
onInputValueChange(newValue: any):Number {
return <Number>newValue;
}
我的目标是拥有一个允许用户将数字编辑为货币的输入字段。例如。用户看到“$1,000”，他们可以键入“0”，编辑框显示“$10,000”。生成的数据模型是一个数字 10000。
<input type="text" name="Data" [ngModel]="Data | currency:'USD':true:'4.0-0'" (ngModelChange)="Data=$event" >
上面在编辑框中显示'$1,000'，但是当我在输入框中编辑数值时，数值不再是数字1000，而是一个字符串“$1,000”。这意味着我的数据模型来自
{ myCost: 1000 }
成为
{ myCost: ",000" }
关于正确执行此操作的任何想法？看起来我需要创建一个新函数来将货币转换回数字。这是可能的，但似乎有更好的方法。
您可以在组件中处理 ngModelChange class
(ngModelChange)="onInputValueChange($event)"
在component.ts
onInputValueChange(newValue: any):Number {
return <Number>newValue;
}