在离子输入上应用货币格式

我想在离子输入上放置一种货币格式,但是角度指令不像在HTML输入Ion-Input not working with directives but regular input does上那样工作 .

所以我一直在努力做像他们在这里说的那样Input currency mask - IONIC和这里Ion-Input currency format但是它们都不适合我 .

一个问题是我有一个以编程方式生成的表单,结构来自这样的服务:

value: 20000,
    key: varKey,
    label: varLabel,
    required: true,
    order: 0,
    controlType: 'textbox',
    type: 'number',
    formula: 'return other_var + 50',
    dependencies: ['other_var'],
    category: 'varCategory'

因此,一些输入更改会使其他值发生更改,如果other_var发生更改(用户在输入中键入新值),则需要根据公式属性重新计算varKey . 这是我创建输入的方式:

<ion-input [id]="key" [formControlName]="key" [type]="type" [ngModel]="value |  currency:'USD':'symbol-narrow'"
 (ngModelChange)="formValueChanges($event,key)" text-right></ion-input>

这给了我这个错误InvalidPipeArgument:'$20,000.00' for pipe 'CurrencyPipe' . 所以我将 CurrencyPipe 导入到我的组件中以执行类似的操作(遵循Ion-input货币格式的帖子):

<ion-input [id]="key" [formControlName]="key" [type]="type" [ngModel]="getCurrencyFormat(value)"
 (ngModelChange)="formValueChanges($event,key)" text-right></ion-input>

getCurrencyFormat函数是这样的:

getCurrencyFormat(value: number): string {
    if (value) {
      console.log('Input value: ', value)
      if (!value.toString().includes('$')) {
        return this.currencyPipe.transform(value, 'USD', true, '1.2-2');
      }
    }
  }

这不会给我任何错误,但不会显示任何值 .

formValueChanges函数将键入的值与模型绑定,并重新计算受影响的值 .

此时我不知道如何在不创建循环的情况下将货币格式应用于输入,因为应用格式的函数会触发重新计算值的函数 .

回答(0)