Использование валютной трубы не работает так, как задумано для ионного ввода

Question

Я пытаюсь использовать currency трубу для элемента ion-input следующим образом.

<ion-input type="number" name="amount" 
 [ngModel]="myObject.amount | currency" 
 (ngModelChange)="myObject.amount = $event">
</ion-input>

Когда я использую этот односторонний подход + подход к событию ,поле ввода пусто в интерфейсе пользователя.Если я проверяю элемент, я вижу значение атрибута ng-reflect-model="$100" в сгенерированном элементе input.Однако, если я изменю type на текст, я получу отображаемое значение 100 долларов.

<ion-input type="text" name="amount" 
 [ngModel]="myObject.amount | currency" 
 (ngModelChange)="myObject.amount = $event">
</ion-input>

Проблема в том, что теперь я теряю цифровую клавиатуру, если type="text" вместо type="number".Любые идеи о том, как заставить это работать с показом цифровой клавиатуры?

Я использую ионно-угловой v3.9.2.

Answer 1

Вы можете попробовать что-то вроде этого,

<ion-input type="number" name="amount" 
 [ngModel]="myObject.amount"
 (change)="updateAmount($event.target.value)">
</ion-input>

и в .ts

updateAmount(qp:number):void {
   this.formattedAmount = this.currencyPipe.transform(this.amount, 'USD');
   element.target.value = this.formattedAmount;
}