如何解决PIPE 被多次调用,我怎样才能让它只调用一次?
HTML : (component.html)
<input #CostInput class="form-element" formControlName="cost" [value]="replaceDecimal.transform(FormGroup.get('cost').value)">
Pipe.ts:
commaLocaleCodes = ['AM','AR'];
transform(input) {
if (input) {
const uiLanguage = 'am');
if (this.commaLocaleCodes.indexOf(uiLanguage.toUpperCase()) > -1) {
return input.replace(".",",");
} else {
return input.replace(",".");
}
}
}
这里的问题是 Pipe 被多次调用。如果我们发送 input = 123.45 。管道应返回 123,45 并停止。但是过滤器再次被调用。再次输入变为 123.45。
管道已经很纯了。我想了解我们是否可以在第一次迭代后停止管道。谢谢。
解决方法
使用默认的变更检测策略,绑定到属性(或指令)的函数将在每个变更检测周期被触发。这就是为什么不鼓励将函数绑定到属性和指令的原因。
改为调用控制器中的函数,将响应保存到变量并在模板中使用绑定。
控制器 (*.ts)
export class SomeComponent implements OnInit {
transformedValue: any;
ngOnInit() {
this.transformedValue = this.replaceDecimal.transform(FormGroup.get('cost').value);
}
}
模板 (*.html)
<input #CostInput class="form-element" formControlName="cost" [value]="transformedValue">
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。