CODEWITHSUNDEEP
angular
NiceToMytyuk
NiceToMytyuk

Reputation: 4277

Input type number unable to format value with number pipe

I'm trying to use number pipe to format my value inside <input type=number /> in my Angular App.

The pipe should format the value with three decimal, by default the value is 1 and in input box it should be displayed as 1.000, but instead if i use any digitsInfo after number no value will be displayed inside input.

I've tryed to make a reproduction of the problem in stackblitz but in it the behaviour is as it have to be while in my Angular App is looks like the following:

enter image description here

As you could see on the gif if i add '1.3' after number: value inside input will disappear..

The problem is not in plu.qta value as even if i set a static 1 as value it will still not display any value inside input.

UPDATE: ok i just found the problem, the issue is that i registeredLocale to italian and if i remove it from my app.module all is formatted correctly.

My app.module looks like this:

import localeIt from '@angular/common/locales/it';
import { registerLocaleData } from '@angular/common';
registerLocaleData(localeIt);

@NgModule...
...
providers: [{provide: LOCALE_ID, useValue: 'it'}]

So by keeping the locale set to Italian, how could i make number pipe work anyway?

Upvotes: 1

Views: 1653

Answers (1)

NiceToMytyuk
NiceToMytyuk

Reputation: 4277

Solved the issue by setting manually locale in number pipe to en-US

So my input looks like this:

    <input
        type="number"
        class="form-control qta"
        [plu]="plu"
        appQuantity
        [min]="plu.um === 'PZ' ? 1 : .001"
        [step]="plu.um === 'PZ' ? 1 : .001"
        [value]="plu.um !== 'PZ' ? ( plu.qta | number: '1.3':'en-US' ) : plu.qta"
      />

Upvotes: 1

Related Questions