在AngModel中的ngModel上的ngModel中使用管道 [英] Using Pipes within ngModel on INPUT Elements in Angular

问题描述

我有一个HTML INPUT字段.

I've an HTML INPUT field.

<input 
    [(ngModel)]="item.value" 
    name="inputField" 
    type="text" 
/>

，我想格式化其值并使用现有管道:

and I want to format its value and use an existing pipe:

.... 
[(ngModel)]="item.value | useMyPipeToFormatThatValue" 
....

并获得错误消息:

动作表达式中不能包含管道

Cannot have a pipe in an action expression

在这种情况下如何使用管道?

How can I use pipes in this context?

推荐答案

您不能使用

You can't use Template expression operators(pipe, save navigator) within template statement:

(ngModelChange)="Template statements"

(ngModelChange)="item.value | useMyPipeToFormatThatValue = $ event"

https://angular.io/guide/template-syntax#template-statements

类似于模板表达式，模板语句使用的语言 看起来像JavaScript.模板语句解析器与 模板表达式解析器，并且特别支持两种基本 赋值(=)和链接表达式(带有;或，).

Like template expressions, template statements use a language that looks like JavaScript. The template statement parser differs from the template expression parser and specifically supports both basic assignment (=) and chaining expressions (with ; or ,).

但是，某些JavaScript语法不允许:

However, certain JavaScript syntax is not allowed:

• 新
• 递增和递减运算符，++和-
• 运算符分配，例如+ =和-=
• 按位运算符|和&
• 模板表达式运算符

• new
• increment and decrement operators, ++ and --
• operator assignment, such as += and -=
• the bitwise operators | and &
• the template expression operators

因此，您应将其编写如下:

So you should write it as follows:

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

柱塞示例

Plunker Example

这篇关于在AngModel中的ngModel上的ngModel中使用管道的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！