numerals

Les chiffres avec lesquels s’écrivent les nombres et les dates.

Type	'latn' | 'locale'
Par défaut	'latn'
Modifiable en direct (update())	Oui
Angular	l’entrée [numerals]
<dz-grid>	l’attribut numerals
Déclaré dans	packages/dom/src/settings.ts

Ce qu’il fait

'latn' : 0 à 9, quelle que soit la langue. 'locale' : les chiffres que la langue écrit par défaut — ١٢٣ pour ar-EG, tandis que ar-DZ et ar-MA écrivent 0 à 9 même alors, comme toute langue sans chiffres à elle. Cela touche les nombres et les dates des cellules.

La grille ne laisse jamais le choix au navigateur : elle décide des chiffres une fois et les écrit, si bien que deux navigateurs montrent le même texte.

Exemple

TypeScript

import { createGrid } from '@dzgrid/dom';
import { AR } from '@dzgrid/dom/locales/ar';

type Well = { id: string; name: string; depth: number };

const grid = createGrid<Well>(document.getElementById('puits')!, {
  rows: [{ id: 'w1', name: 'بئر النخلة', depth: 42 }],
  columns: [{ id: 'name', header: 'البئر' }, { id: 'depth', header: 'العمق (م)', type: 'number' }],
  getRowId: (w) => w.id,
  messages: AR,
  locale: 'ar-EG',
  numerals: 'locale',
});

grid.update({ numerals: 'latn' });

Angular

import { Component } from '@angular/core';
import { DzGrid, type DzgColumnOrGroup } from '@dzgrid/angular';
import { AR } from '@dzgrid/dom/locales/ar';

type Well = { id: string; name: string; depth: number };

@Component({
  selector: 'app-puits',
  imports: [DzGrid],
  template: `<dz-grid [rows]="rows" [columns]="columns" [getRowId]="rowId" [messages]="messages" locale="ar-EG" numerals="locale" />`,
})
export class Wells {
  readonly rows: Well[] = [{ id: 'w1', name: 'بئر النخلة', depth: 42 }];
  readonly columns: DzgColumnOrGroup<Well>[] = [{ id: 'name', header: 'البئر' }, { id: 'depth', header: 'العمق (م)', type: 'number' }];
  readonly rowId = (w: Well) => w.id;
  readonly messages = AR;
}

Web Component

<dz-grid locale="ar-EG" numerals="locale"></dz-grid>

import '@dzgrid/element/define';
import type { DzGridElement } from '@dzgrid/element';
import { AR } from '@dzgrid/dom/locales/ar';

type Well = { id: string; name: string; depth: number };

const grid = document.querySelector<DzGridElement<Well>>('dz-grid')!;
grid.columns = [{ id: 'name', header: 'البئر' }, { id: 'depth', header: 'العمق (م)', type: 'number' }];
grid.getRowId = (w) => w.id;
grid.messages = AR;
grid.rows = [{ id: 'w1', name: 'بئر النخلة', depth: 42 }];

Démo

L’arabe (ar-EG) avec ses propres chiffres.

Voir aussi

• locale — la langue dans laquelle s’écrivent les nombres.
• direction — de droite à gauche.