Formatering af valuta ved hjælp af en pipe i Angular

Med CurrencyPipe pipen kan valuta formateres. I den første parameter for pipen overføres valuta koden ifølge ISO 4217 specifikationen (standard er USD). I den anden parameter angiver vi valutaens visning. Den kan tage følgende værdier: 'code' (valuta kode), 'symbol' (dens symbol), 'symbol-narrow' (for lande, der har flere valutasymboler), 'string' (for at vise en hvilken som helst streng). I den tredje valgfrie parameter kan vi angive talformatet, svarende til DecimalPipe pipen. I den fjerde valgfrie parameter kan koden for den anvendte lokalitet angives:

html<div>{{ value | number : valuta kode : valuta visning : talformat : lokalitets kode }}</div>

Eksempler

Lad os prøve pipen med eksempler. For at gøre dette, lad os i komponentklassen angive følgende egenskab salary, som indeholder løn i en bestemt valuta:

app/app.component.tsexport class AppComponent {
  salary: number = 867.564;
}

Eksempel

Lad os konvertere vores tal til valuta:

app/app.component.html<div>{{ salary | currency }}</div>

Resultat af kodeudførelse:

html<div>$867.56</div>

Eksempel

Lad os nu angive valutaens visning i russiske roebler:

app/app.component.html<div>{{ salary | currency:'RUB':'code' }}</div>

Resultat af kodeudførelse:

html<div>RUB867.56</div>

Eksempel

Lad os vise symbolet for den russiske roebel ved siden af tallet:

app/app.component.html<div>{{ salary | currency:'RUB':'symbol-narrow' }}</div>

Resultat af kodeudførelse:

html<div>₽867.56</div>

Eksempel

Lad os nu lave et tal med fire cifre i brøkdelen:

app/app.component.html<div>{{ salary | currency:'RUB':'symbol':'2.4-5' }}</div>

Resultat af kodeudførelse:

html<div>RUB867.5640</div>

Eksempel

Lad os tilføje følgende streng til valutaens visning:

app/app.component.html<div>{{ salary | currency:'RUB':'this is a new currency - ' }}</div>

Resultat af kodeudførelse:

html<div>this is a new currency - 867.56</div>