Angular 5 percent pipe digitInfo not working as expected

angular angular-pipe
Wagner Danda da Silva Filho picture Wagner Danda da Silva Filho · Dec 6, 2017 · Viewed 7.3k times · Source

If I do this in an Angular 5 template:

{{0.7 | percent:'1.2-5'}}

I get this as expected: 70.00%

However, when I do this:

{{0.07 | percent:'1.2-5'}}

I get 7.00000% instead of what the expected 7.00%

Am I just doing something wrong or is this a bug in Angular?

Answer

Stefan Svrkota picture Stefan Svrkota · Dec 6, 2017

Seems like a bug with DecimalPipe because PercentPipe uses it for formatting. Simple removal of maxFractionDigits which is the maximum number of digits after fraction (default is 3) will get you the desired result:

{{0.7 | percent:'1.2'}} --> 70.00%
{{0.07 | percent:'1.2'}} --> 7.00%

Related questions

Format date as dd/MM/yyyy using pipes

I'm using the date pipe to format my date, but I just can't get the exact format I want without a workaround. Am I understanding pipes wrongly or is just not possible? //our root app component import {Component} from 'angular2/…

Read More
OrderBy pipe issue

I'm not able to translate this code from Angualr 1 to Angular 2: ng-repeat="todo in todos | orderBy: 'completed'" This is what i've done following the Thierry Templier's answer: Component template: *ngFor="#todo of todos | sort" Component code: @Component({ selector: 'my-app', templateUrl: "./…

Read More
What is pipe() function in Angular

Pipes are filters for transforming data (formats) in the template. I came across the pipe() function as below. What does this pipe() function exactly mean in this case? return this.http.get<Hero>(url) .pipe( tap(_ => this.…

Read More