As I find myself in France where the decimal separator is a comma, I have created this component that showcases a discrepancy in displaying numbers:
- Both
commune.populationandcommune.surfaceare decimal numbers (with the typenumber) - However, they unexpectedly show different decimal separators: a point for surface and a comma for density.
Commune with 176016 inhabitants and an area of 80.03 km² (density: 2,199)
within the Saint-Etienne Métropole intermunicipal authority
Why is this happening?
<div class="row">
<div class="presentation_cadre" id="presentation_cadre">
<ng-template [ngIf]="isCommuneSelected()" [ngIfElse]="pasDeCommuneSelectionnee">
<div>
<h4>{{ commune.nomCommune }} ({{ commune.nomDepartement }} ({{ commune.codeDepartement }}))</h4>
<small>
<div>Commune with {{ commune.population }} inhabitants and {{ commune.surface / 100.0 }} km² (density: {{ this.getDensitePopulation() | number:'1.0-0' }})</div>
<div>within the {{ commune.nomEPCI }} intermunicipal authority</div>
</small>
</div>
</ng-template>
<ng-template #pasDeCommuneSelectionnee>
Information about a commune will be displayed here
</ng-template>
</div>
</div>
public getDensitePopulation() : number {
if (this.commune == null || this.commune.surface == 0) {
return 0
}
let surfaceKm2 = this.commune.surface / 100.00; // The surface is in hectares
return this.commune.population / surfaceKm2
}