Angular 5 - currencyPipe

Question

I have a problem with the already built in CurrencyPipe from Angular.

I need to display a currency sign using the CurrencyPipe but I can't use it unless I provide an input number.

Because the CurrencyPipe uses the current locale to get the currency sign, I was thinking that the input number could be optional.

Current Behaviour:

{{ 1 | currency:'USD' }} --> $1 

Needed Behaviour:

{{ null | currency:'USD' }} --> $ 

Does any of you know if this is possible with the default Pipe? Thanks!!

Answer 1

Update Angular 8

import { Pipe, PipeTransform } from '@angular/core'; import { CurrencyPipe } from '@angular/common';  @Pipe({ name: 'CustomeCurrency' }) export class CustomCurrencyPipe implements PipeTransform {      constructor(private currencyPipe: CurrencyPipe) { }     transform(value: any, currencyCode?: string, display?: string | boolean, digitsInfo?: string, locale?: string): string {         if (value != null)             return this.currencyPipe.transform(value, currencyCode, display, digitsInfo, locale);         return this.currencyPipe.transform(0, currencyCode, display, locale).split('0.00')[0];     } } 

---

Try this simple custom currency pipe

{{ null | CustomeCurrency }}</p>

import { Pipe, PipeTransform } from '@angular/core'; import { CurrencyPipe } from '@angular/common'; @Pipe({ name: 'CustomeCurrency' }) export class CustomCurrencyPipe implements PipeTransform {  constructor(private currencyPipe: CurrencyPipe) { }  transform(value: any, currency: string, symbol: boolean = false): string {      if (value != null)         return this.currencyPipe.transform(value, currency, symbol);     return this.currencyPipe.transform(0, currency, symbol).split('0.00')[0];  } } 

Answer 2

If you're getting the error message The currency pipe has been changed in Angular v5. The symbolDisplay option (third parameter) is now a string instead of a boolean. The accepted values are "code", "symbol" or "symbol-narrow". then refer to the Angular documentation for help, use the code samples on this page to fix the issue: https://angular.io/api/common/CurrencyPipe