Рақамҳоро бо истифода аз каналҳо дар Angular формат кардан

Бо истифода аз канали DecimalPipe метавон рақамҳоро формат кард. Дар параметри якуми канал мо шумораи ҳадди ақали рақамҳоро дар қисми бутун медиҳем. Дар параметри дуюм шумораи ҳадди ақали рақамҳоро дар қисми касрӣ муайян мекунем. Дар параметри сеюми ихтиёрӣ шумораи ҳадди аксари рақамҳоро дар қисми касрӣ муқаррар мекунем.

Гарчанде ки канали мо DecimalPipe ном дорад, барои фарохонӣ кардани он мо ин тавр менависем: number.

Биёед дар амал санҷем. Дар класи компоненти рақами зеринро муқаррар кунем:

export class AppComponent {
	num: number = 18;
}

Намуна

Биёед рақами худро ба тавре чоп кунем, ки дар қисми бутуни он ду рақам бошанд. Дар ин ҳол ҳадди ақали рақамҳо дар қисми касрӣ 1 хоҳад буд:

<div>{{ num | number:'2.1' }}</div>

Натиҷаи иҷрои рамз:

<div>18.0</div>

Намуна

Акнун биёед муқаррар кунем, ки дар қисми касрии рақами мо ду рақам намоиш дода шаванд:

<div>{{ num | number:'2.2' }}</div>

Натиҷаи иҷрои рамз:

<div>18.00</div>

Намуна

Биёед рақами нав муқаррар кунем:

export class AppComponent {
	num: number = 18.67899;
}

Ва онро дар шаблони HTML ба тавре чоп кунем, ки дар қисми касрӣ ҳадди аксар ду рақам намоиш дода шаванд:

<div>{{ num | number:'2.1-2' }}</div>

Натиҷаи иҷрои рамз:

<div>18.68</div>

Намуна

Акнун рақами худро ба тавре формат кунем, ки дар қисми бутуни он се рақам бошанд. А дар қисми касрӣ панҷ рақам намоиш дода шавад:

<div>{{ num | number:'3.5-6' }}</div>

Натиҷаи иҷрои рамз:

<div>018.67899</div>

Намуна

Биёед кӯшиш кунем, ки ҳадди ақали рақамҳоро дар қисми касрӣ чоп кунем, ки аз шумораи додашуда дар рақам зиёд бошад. Дар ҳолати мо шаш рақамро чоп мекунем:

<div>{{ num | number:'3.6-8' }}</div>

Дар натиҷаи иҷрои рамз мо мебинем, ки канали DecimalPipe сифрро ба қисми касрӣ илова кардааст:

<div>018.678990</div>