Angular - formatowanie dat i kwot w całej aplikacji tylko dla widoku

0

Witam.
Potrzebuje nakierowania czy jest opcja, aby formatowanie dat i kwot było tylko dla widoku. Stworzyłem sobie dyrektywę (CurrencyFormatter), która mi te kwoty formatuje na polski:

<mat-form-field floatLabel="always" appearance="outline" style="width:30%;font-size: 13px;">
   <mat-label>Cena brutto</mat-label>
   <input matInput formControlName="buyPriceGross" autocomplete="off" currencyFormatter>
   <span matSuffix style="font-weight: normal;">PLN</span>
</mat-form-field>

Problem zaczyna się w momencie gdy chce taki obiekt zapisać. W polu buyPriceGross, i innych sformatowanych, dostaje wpisy "1 353,86".

To samo tyczy się dat. Nasz format to dd.MM.yyyy i takiego formatu API nie chce mi przyjąć i przed wysłaniem muszę przekonwertować na yyyy-MM-ddd. Jak to ogarnąć? Czy powinienem to obsłużyć po stronie API?

0

Mozesz sprobowac z czyms takim:

<input matInput formControlName="buyPriceGross" autocomplete="off" [value]="buyPriceGrossValue | currencyFormatter">

Oczywiscie z directive musisz zrobic pipe, byc moze z template diven forms za pomoca [ngModel] i (ngModelChange) tez mozna zrobic uzywajac pipe.

0

A to nie jest tak, że jakakolwiek ingerencja w value powoduje, że mój FormGroup będzie miał tą wartość po formatowaniu? Nie potrzebuje robić swojego pipe'a, jest wbudowany w Angular CurrencyPipe. Spróbowałem na szybko na stackblitz i zachowuje się to poprawnie w kwestii wyświetlania ale niestety wpisywanie wartości szaleje, ponieważ z każdym wpisem pipe próbuje formatować kwotę 🤦‍♂️

Angular value formatting test

0

Jeżeli Angular material łapie to co pisałem w komentarzu, to mógłbyś zrobić osobny komponent z ControlValueAccessor i tam zrobić mapowanie wartości która zostaje przekazana do komponentu przez ngModel na wartość wyświetlaną i odwrotnie. Poradników do tego jest dość sporo ( np. https://medium.com/@majdasab/implementing-control-value-accessor-in-angular-1b89f2f84ebf ) - tylko tak jak mówię, nie wiem czy Angular Material to łyknie. Ewentualnie możesz zrobić wrapper na cały mat-field. To już powinno zadziałać.

1 użytkowników online, w tym zalogowanych: 0, gości: 1