Angular2+ currency pipe处理1000以上数值报InvalidPipeArgument错误如何解决

你在模板里的管道调用顺序错误：

• number 管道接收数字类型输入后，会输出带千分位分隔符的字符串（比如数值1004.33经过number管道后会变成字符串"1,004.33"）
• 后续的currency管道要求接收的输入是数字类型，拿到带逗号的字符串后无法解析，就抛出了类型不匹配的报错。

直接删除模板中多余的number管道即可，currency管道本身就内置了数字格式化的能力，不需要叠加number管道使用。

修改后的模板代码如下：

<p>
  {{totalPrice$ | async | currency: "USD"}}
</p>
<div>
  <button type="button" (click)="onCalcPrice()">increase price amount</button>
</div>

如果需要自定义数字的小数位、整数位规则，直接把格式参数传给currency管道即可，示例（保留2位小数）：

{{totalPrice$ | async | currency: "USD":"symbol":"1.2-2"}}

参数说明：最后一个1.2-2表示最少1位整数，最少2位小数、最多2位小数，和number管道的格式参数规则完全一致。

内容的提问来源于stack exchange，提问作者Олег Войтинський