Formatering av valuta med hjälp av en pipe i Angular
Med hjälp av pipen CurrencyPipe kan
valutaformatering göras. I den första
parametern till pipen skickas valutakoden
enligt ISO 4217 specifikationen (standard
är USD). I den andra parametern ställer vi in
valutavisning. Den kan ha följande värden: 'code' (valutakod),
'symbol' (dess symbol),
'symbol-narrow' (för länder som har
flera valutasymboler), 'string'
(för att visa valfri sträng). I den tredje
valfria parametern kan vi ange
talformat, liknande pipen DecimalPipe.
I den fjärde valfria parametern kan
locale-kod anges:
<div>{{ value | currency : valutakod : valutavisning : talformat : locale-kod }}</div>
Exempel
Låt oss prova pipens funktion med exempel.
För att göra detta, sätter vi följande
egenskap salary i komponentklassen, som innehåller
lön i en viss valuta:
export class AppComponent {
salary: number = 867.564;
}
Exempel
Låt oss omvandla vårt nummer till valuta:
<div>{{ salary | currency }}</div>
Resultat av kodkörning:
<div>$867.56</div>
Exempel
Låt oss nu ange valutavisning i ryska rubel:
<div>{{ salary | currency:'RUB':'code' }}</div>
Resultat av kodkörning:
<div>RUB867.56</div>
Exempel
Låt oss visa symbolen för rysk rubel bredvid numret:
<div>{{ salary | currency:'RUB':'symbol-narrow' }}</div>
Resultat av kodkörning:
<div>₽867.56</div>
Exempel
Låt oss nu göra ett nummer med fyra siffror i bråkdelen:
<div>{{ salary | currency:'RUB':'symbol':'2.4-5' }}</div>
Resultat av kodkörning:
<div>RUB867.5640</div>
Exempel
Låt oss lägga till följande sträng till valutavisningen:
<div>{{ salary | currency:'RUB':'this is a new currency - ' }}</div>
Resultat av kodkörning:
<div>this is a new currency - 867.56</div>
Praktiska uppgifter
Givet nummer:
salary: number = 134.89;
Formatera det på följande sätt:
'$134.89'
Givet nummer:
salary: number = 134.89;
Formatera det på följande sätt:
'€134.89'
Givet nummer:
salary: number = 134.89;
Formatera det på följande sätt:
'$134.890'
Givet nummer:
salary: number = 134.89;
Formatera det på följande sätt:
'$0,134.8900'
Givet nummer:
salary: number = 134.89;
Formatera det på följande sätt:
'this currency is changed 134.89'