Как получить вход для отображения и редактирования валюты с угловыми 4 трубами

Question

Моя цель состоит в том, чтобы иметь поле ввода, которое позволяет пользователю редактировать число в качестве валюты. Например, пользователь видит "1000 долларов", он может ввести "0", а в окне редактирования отображается "10000 долларов". И результирующая модель данных это число 10000.

<input type="text" name="Data" [ngModel]="Data | currency:'USD':true:'4.0-0'" (ngModelChange)="Data=$event" >

Вышеуказанное отображается в поле для редактирования "$1000", но когда я редактирую значение в поле ввода, это значение больше не число 1000, а строка "$1000". Это означает, что моя модель данных пошла от

{ myCost: 1000 } 

становиться

{ myCost: "$1,000" }

Есть идеи, как правильно это сделать? Похоже, мне нужно создать новую функцию для преобразования из валюты обратно в число. Что возможно, но кажется, что есть лучший способ.

Answer 1

Вы можете обрабатывать ngModelChange в вашем классе компонентов(ngModelChange)="onInputValueChange($event)"

В component.ts
onInputValueChange(newValue: any):Number { return <Number>newValue; }