我试图弄清楚如何在反应形式中使用管道，以便将输入强制转换为货币格式。我已经为此创建了自己的管道，并在代码的其他区域进行了测试，因此我知道它可以作为简单管道使用。我的管道名称是“ udpCurrency”
在堆栈溢出时，我能找到的最接近的答案是：在Angular2-View的INPUT元素上的ngModel中使用管道。但是，这在我的情况下不起作用，我怀疑这与我的表单具有反应性有关
这是所有相关代码：
模板
<form [formGroup]="myForm" #f="ngForm">
<input class="form-control col-md-6"
formControlName="amount"
[ngModel]="f.value.amount | udpCurrency"
(ngModelChange)="f.value.amount=$event"
placeholder="Amount">
</form>
组件
import { Component, OnInit, HostListener } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
export class MyComponent implements OnInit {
myForm: FormGroup;
constructor(
private builder: FormBuilder
) {
this.myForm = builder.group({
amount: ['', Validators.required]
});
}
}
错误：
ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'undefined: '. Current value: 'undefined: undefined'
当您混合使用模板驱动形式和反应形式时，可能会发生这种情况。您有两个绑定相互竞争。选择模板驱动或反应形式。如果您想采用反应性路线，则可以将其[value]用于管道...
注意，该管道仅用于在视图中显示所需的输出。
<form [formGroup]="myForm">
<input
[value]="myForm.get('amount').value | udpCurrency"
formControlName="amount"
placeholder="Amount">
</form>
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句