Angular හි pipe එකක් භාවිතයෙන් මුදල් ආකෘතිකරණය කිරීම

CurrencyPipe pipe එක භාවිතයෙන් මුදල් ප්‍රදර්ශනය ආකෘතිකරණය කළ හැක. pipe එකේ පළමු පරාමිතියේදී ISO 4217 නිශ්චිත ක්‍රමයට අනුව මුදල් කේතය සපයනු ලැබේ (පෙරනිමිය USD වේ). දෙවන පරාමිතියේදී මුදල් ප්‍රදර්ශනයේ ස්වරූපය නියම කරනු ලැබේ. එය පහත දැක්වෙන අගයන් ගත හැකිය: 'code' (මුදල් කේතය), 'symbol' (එහි සංකේතය), 'symbol-narrow' (මුදල් සංකේත කිහිපයක් ඇති රටවල් සඳහා), 'string' (ඕනෑම තන්තුවක් ප්‍රතිදානය කිරීම සඳහා). තෙවන විකල්ප පරාමිතියේදී, DecimalPipe pipe එකට සමාන අංක ආකෘතිය නියම කළ හැකිය. හතරවන විකල්ප පරාමිතියේදී භාවිතා කරන ස්ථානීය කේතය නිශ්චිත කළ හැකිය:

<div>{{ value | number : මුදල් කේතය : මුදල් ප්‍රදර්ශනය : අංක ආකෘතිය : ස්ථානීය කේතය }}</div>

උදාහරණ

අපි උදාහරණ මගින් pipe එකේ ක්‍රියාකාරිත්වය පරීක්ෂා කර බලමු. මේ සඳහා, component එකේ class එකේ පහත දැක්වෙන salary ගුණාංගය නියම කරමු, එය යම් මුදල් වර්ගයකින් වැටුපක් අඩංගු වේ:

export class AppComponent {
	salary: number = 867.564;
}

උදාහරණය

අපි අපේ අංකය මුදල් වර්ගයකට පරිවර්තනය කරමු:

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

කේතය ධාවනය කිරීමේ ප්‍රතිඵලය:

<div>$867.56</div>

උදාහරණය

දැන් අපි රුසියානු රූබල් වලින් මුදල් ප්‍රදර්ශනය නියම කරමු:

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

කේතය ධාවනය කිරීමේ ප්‍රතිඵලය:

<div>RUB867.56</div>

උදාහරණය

අපි අංකය අසල රුසියානු රූබල් සංකේතය ප්‍රදර්ශනය කරමු:

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

කේතය ධාවනය කිරීමේ ප්‍රතිඵලය:

<div>₽867.56</div>

උදාහරණය

දැන් අපි භාගික කොටසෙහි ඉලක්කම් හතරක් සහිත අංකයක් සමඟ කරමු:

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

කේතය ධාවනය කිරීමේ ප්‍රතිඵලය:

<div>RUB867.5640</div>

උදාහරණය

අපි මුදල් ප්‍රදර්ශනයට පහත තන්තුව එකතු කරමු:

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

කේතය ධාවනය කිරීමේ ප්‍රතිඵලය:

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