Valūtas formatēšana, izmantojot kanālu Angular

Izmantojot kanālu CurrencyPipe, var formatēt valūtas izvadi. Kanāla pirmajā parametrā tiek padots valūtas kods saskaņā ar ISO 4217 specifikāciju (pēc noklusējuma USD). Otrajā parametrā iestatām valūtas attēlošanu. Tam var būt šādas vērtības: 'code' (valūtas kods), 'symbol' (tās simbols), 'symbol-narrow' (valstīm, kurām ir vairāki valūtas simboli), 'string' (jebkuras virknes attēlošanai). Trešajā neobligātajā parametrā varam iestatīt skaitļa formātu, līdzīgi kanālam DecimalPipe. Ceturtajā neobligātajā parametrā var norādīt izmantotās locales kodu:

<div>{{ value | number : valūtas kods : valūtas attēlošana : skaitļa formāts : locales kods }}</div>

Piemēri

Izmēģināsim kanāla darbību ar piemēriem. Lai to izdarītu, komponenta klasē iestatīsim šādu īpašību salary, kas satur algu kādā valūtā:

export class AppComponent {
	salary: number = 867.564;
}

Piemērs

Pārveidosim mūsu skaitli par valūtu:

<div>{{ salary | currency }}</div>

Koda izpildes rezultāts:

<div>$867.56</div>

Piemērs

Tagad norādīsim valūtas attēlošanu krievu rubļos:

<div>{{ salary | currency:'RUB':'code' }}</div>

Koda izpildes rezultāts:

<div>RUB867.56</div>

Piemērs

Parādīsim blakus skaitlim krievu rubļa simbolu:

<div>{{ salary | currency:'RUB':'symbol-narrow' }}</div>

Koda izpildes rezultāts:

<div>₽867.56</div>

Piemērs

Tagad iegūstam skaitli ar četriem cipariem daļējā daļā:

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

Koda izpildes rezultāts:

<div>RUB867.5640</div>

Piemērs

Pievienosim valūtas attēlojumam šādu virkni:

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

Koda izpildes rezultāts:

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

Praktiskie uzdevumi

Dots skaitlis:

salary: number = 134.89;

Formatējiet to šādā formā:

'$134.89'

Dots skaitlis:

salary: number = 134.89;

Formatējiet to šādā formā:

'€134.89'

Dots skaitlis:

salary: number = 134.89;

Formatējiet to šādā formā:

'$134.890'

Dots skaitlis:

salary: number = 134.89;

Formatējiet to šādā formā:

'$0,134.8900'

Dots skaitlis:

salary: number = 134.89;

Formatējiet to šādā formā:

'this currency is changed 134.89'