使用双绑定在Angular2的输入字段中按类型输入数字格式 [英] Number formatting as-you-type in an input field in Angular2 with double binding

问题描述

使用类似管道

<input....
    [ngModel]="whatever | myCurrencyPipe"
    (ngModelChange)="whatever = $event"
    type="text"
    name="myCurreny"
    ...

您可以格式化现有值.您几乎不想覆盖值，但您遇到了问题.并通过上述解决方案，取消了双重绑定.

you can format an existing value. Scarcely you want to overwrite the value, you have problems. And with the solution above, the double binding has been abrogated.

有很多 jQuery-Libraries ，但我正在寻找原生的angular2解决方案.

There are plenty of jQuery-Libraries but I am looking for native angular2 solutions.

有人可以帮助我吗?

推荐答案

1. 扩展NgModel指令.覆盖每次输入更改并设置模型值后调用的viewToModelUpdate(value)函数.
2. 将NgModel替换为您的实现(模块中的providers [])
3. 直接从指定的属性中读取regexp或过滤器或格式化程序，例如:<输入filter ="currency"/>

工作示例，您可以在这里找到: http://stacktrase.com/2017/07/14/angularjs4-restrict-input-text-by-extended-ngmodel/

Working example you can find here: http://stacktrase.com/2017/07/14/angularjs4-restrict-input-text-by-extending-ngmodel/

这篇关于使用双绑定在Angular2的输入字段中按类型输入数字格式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！