在Angular中的INPUT元素中使用ngModel中的管道

Question

在Angular中的INPUT元素中使用ngModel中的管道我有一个HTML INPUT字段。<input      [(ngModel)]="item.value"      name="inputField"      type="text" />我想格式化它的值并使用现有的管道：.... [(ngModel)]="item.value | useMyPipeToFormatThatValue" ....并收到错误消息：动作表达式中不能有管道在这种情况下如何使用管道？

Answer 1

<input [ngModel]="item.value | useMyPipeToFormatThatValue" 
      (ngModelChange)="item.value=$event" name="inputField" type="text" />

这里的解决方案是将绑定拆分为单向绑定和事件绑定 - 语法[(ngModel)]实际包含在内。[]是单向绑定语法，()是事件绑定语法。当一起使用时 - [()]Angular将其识别为速记，并以单向绑定和绑定到组件对象值的事件的形式连接双向绑定。

您不能使用[()]管道的原因是管道仅适用于单向绑定。因此，必须将管道拆分为仅对单向绑定进行操作并单独处理事件。

有关详细信息，请参阅角度模板语法。

Answer 2

<input [ngModel]="item.value | currency" (ngModelChange)="item.value=$event"name="name" type="text" />

我想再接受一个接受的答案。

如果输入控件的类型不是文本，则管道将不起作用。

记住它并节省您的时间。