我想在离子输入上放置一种货币格式,但是角度指令不像在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函数将键入的值与模型绑定,并重新计算受影响的值 .
此时我不知道如何在不创建循环的情况下将货币格式应用于输入,因为应用格式的函数会触发重新计算值的函数 .