Angular number pipe doesn't work in a modal

Issue

I get an error – Error: NG0302: The pipe ‘number’ could not be found! when I used it in a modal of my Ionic Framework Angular app. The code below works fine in the parent page and other places in the app without any pipe declarations. It just fails in the modal.

{{ data.amount | number: '1.2-2'}} 

I even tried the following to see if I can somehow convert my amount to two decimal places or may be put through a pipe but no success.

{{ data.amount*1.00 }}

Solution

Found a much simpler and easier workaround for this –

In my page.ts file – I got the amount value from the array and used the javascript toFixed function to convert my amount to 2 decimals. This is not ideal but it works. To use the angular way, it required importing and declaring DecimalPipe at so many places.

 this.amount = this.amount.toFixed(2);

Angular 1.0 used to be so simple to use. After that it has become a bag of frustrations. Next app in React for sure.

Answered By – techwestcoastsfosea

Answer Checked By – Dawn Plyler (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.