Angular-da kanallar bilen sanlary formatirlemek

DecimalPipe kanaly bilen sanlary formatirlemek mümkindir. Kanalyň birinji parametrinde biz tutuş bölümde iň az san sanlaryny berýäris. Ikinji parametrde nahar bölümde iň az san sany sanlaryny görkezýäris. Üçünji hökmany däl parametrde nahar bölümde iň köp san sany sanlaryny kesgitleýäris.

Kanalymyzyň ady DecimalPipe bolsa-da, ony çagyrmak üçin biz şeýle ýazýarys: number.

Häzir amaly işjeňde synap göreris. Komponent klassynda aşakdaky sany kesgitleýäris:

app/app.component.tsexport class AppComponent {
  num: number = 18;
}

Mysal

Bizim sanymyzy şeýle görkezeliň, tutuş bölümünde iki san bolsun. Şol bir wagtyň özünde nahar bölümde iň az san sany 1 bolsun:

app/app.component.html<div>{{ num | number:'2.1' }}</div>

Kodyň ýerine ýetiriliş netijesi:

html<div>18.0</div>

Mysal

Indi bizim sanymyzyň nahar bölümünde iki san görkeziljek bolsun:

app/app.component.html<div>{{ num | number:'2.2' }}</div>

Kodyň ýerine ýetiriliş netijesi:

html<div>18.00</div>

Mysal

Täze san kesgitleýäris:

app/app.component.tsexport class AppComponent {
  num: number = 18.67899;
}

We ony HTML şablonunda şeýle görkezeliň, ýagy nahar bölümde iň köp iki san görkezilsin:

app/app.component.html<div>{{ num | number:'2.1-2' }}</div>

Kodyň ýerine ýetiriliş netijesi:

html<div>18.68</div>

Mysal

Indi bizim sanymyzy şeýle formatirleýäris, tutuş bölümünde üç san bolsun. A nahar bölümde bäş san görkezilsin:

app/app.component.html<div>{{ num | number:'3.5-6' }}</div>

Kodyň ýerine ýetiriliş netijesi:

html<div>018.67899</div>

Mysal

Nahar bölümde iň az san sanyny görkezmäge synap göreris, sanda kesgitlenenden köp. Bizim ýagdaýymyzda alty san görkezeris:

app/app.component.html<div>{{ num | number:'3.6-8' }}</div>

Kodyň ýerine ýetiriliş netijesinde biz göreris, DecimalPipe kanaly nol nahar bölüme goşdy:

html<div>018.678990</div>