如何在Angular 2 FormControlName上应用管道

Question

我在我的formcontrolname上应用数字管道。 formcontrolname对html中的某些操作具有价值。 加载表单时，其值为空。 下面是我的代码，加载屏幕时看到以下错误。

当tempValue为123时，我需要显示123.00 如果值为777.45，则需要显示777.45

<input  type="number" formControlName="{{tempValue | number:'3.2'}}"  id="tempValue" name="tempValue" >

错误错误：InvalidPipeArgument：管道“ DecimalPipe”的“ [object HTMLInputElement]”

Answer 1

formControlName用于将输入字段映射到FormGroup的定义，并不意味着定义输入字段的格式。

据我所知，Angular开箱即用不支持格式化输入字段。但是，您可以像创建this article一样创建所需格式的指令。我还发现someone else试图这样做。

对我来说，一个更重要的问题是，您确定要在输入字段中设置值的格式吗？通常，用户倾向于觉得这很烦人。如果仅在页面上其他位置设置格式，那么您的问题将不再是问题：

<input type="number" formControlName="tempValue" id="tempValue" name="tempValue">
Value entered: {{yourForm.value.tempValue | number:'3.2'}}