Options de colonne

Une colonne est un objet simple (ColumnDef<T> de @dzgrid/core), le même en TypeScript, dans les [columns] d’Angular et dans la propriété columns du Web Component ; Angular prend aussi des classes de composants dans ui. Chaque page donne les faits de la clé (son type, sa valeur par défaut), ce qu’elle fait, un exemple et, quand elle montre quelque chose, une grille vivante. Les clés d’une colonne changent quand vous redonnez les colonnes : update({ columns }).

Une est obligatoire : id. Les autres sont facultatives. TypeScript signale une clé inconnue ; la grille l’ignore.

Nom	Type	Rôle
id (obligatoire)	string	Le nom de la colonne pour la grille : obligatoire, unique et stable.
field	string	Un chemin dans la ligne, `a.b.c`, où la colonne lit sa valeur.
value	(row: Readonly<T>) => V	Une fonction qui calcule la cellule à partir de toute la ligne.
header	string	Le titre de la colonne, déjà traduit.
headerShort	string	Un titre plus court, sans unité, là où la place manque.
type	ColumnType	Ce que contiennent les cellules : texte, nombre, jour, instant, oui/non, liste ou sur mesure.
codec	ValueCodec<V>	Votre propre façon de lire, afficher, trier et exporter les valeurs de la colonne.
enumOptions	readonly EnumOption[]	La liste fermée d’une colonne `enum` : chaque valeur, son libellé, ses autres noms.
assumeZone	string	Le fuseau dans lequel une colonne `instant` lit une date et heure écrite sans décalage.
numberFormat	NumberFormatSpec	Comment une colonne `number` affiche ses nombres : décimales, pourcentage, devise, séparateurs.
instantFormat	InstantFormatSpec	Ce qu’une colonne `instant` affiche de chaque moment : la date, l’heure, les secondes.
width	number	La largeur de la colonne, en pixels.
minWidth	number	La largeur la plus étroite que la colonne peut prendre, en pixels.
maxWidth	number	La largeur la plus grande que la colonne peut prendre, en pixels.
flex	number	Une part de la place que laissent les colonnes fixes.
resizable	boolean	Si l’utilisateur peut changer la largeur de la colonne.
movable	boolean	Si la colonne peut changer de place ou de côté.
hideable	false	`false` : l’utilisateur ne peut pas masquer la colonne.
menu	false	`false` : la colonne n’a pas de menu de colonne.
chooser	false	`false` : la colonne est laissée hors du sélecteur de colonnes.
sortable	boolean	`false` : la colonne ne peut pas être triée.
groupable	boolean	`false` : les lignes ne sont jamais groupées par cette colonne.
aggFunc	AggFuncName | AggFn<V>	Le total de la colonne sur les lignes de groupe, les pieds de groupe et le total général.
total	AggFuncName | AggFn<V>	Le total de la colonne dans la ligne de totaux d’une grille sans groupes.
headerVertical	boolean	Le titre de la colonne écrit de bas en haut.
headerWrap	boolean	Un titre long sur plusieurs lignes.
collapsePriority	number	Sur un écran étroit, les colonnes qui se replient les premières sous leurs lignes.
filter	false | { readonly kind?: string; readonly floating?: boo…	Si la colonne peut être filtrée, et l’allure de son filtre.
pinned	Side | null	Garde la colonne au début ou à la fin, pendant que les autres défilent.
hidden	boolean	La colonne démarre masquée.
align	'start' | 'center' | 'end'	L’endroit où le texte se place dans les cellules : début, centre ou fin.
headerAlign	'start' | 'center' | 'end'	L’endroit où le titre se place dans l’en-tête, quand ce n’est pas celui du texte des cellules.
wrap	boolean	Le texte des cellules passe sur plusieurs lignes.
ui	{ readonly cell?: string; readonly header?: string; reado…	Votre propre dessin et vos classes pour les cellules et le titre de la colonne.
headerTooltip	string	Le texte affiché sur le titre de la colonne, déjà traduit.
tooltip	(value: V | null, row: Readonly<T>, context: unknown) => …	Le texte affiché sur une cellule, d’après sa valeur et sa ligne.
merge	true | ((a: SpanCtx<T>, b: SpanCtx<T>) => boolean) | { re…	Des lignes consécutives de même valeur montrent une seule grande cellule.
rowSpan	(ctx: SpanCtx<T>) => number	Le nombre de lignes que couvre une cellule, décidé d’après les données.
colSpan	(ctx: SpanCtx<T>) => number	Le nombre de colonnes que couvre une cellule, décidé d’après les données.
groupShow	'open' | 'closed'	Sous un groupe de colonnes repliable : affichée seulement quand il est ouvert, ou seulement quand il est fermé.
csv	'text'	`'text'` : une valeur faite de chiffres garde ses zéros de tête dans Excel.
editable	EditableRule<T>	Si les cellules de la colonne peuvent être modifiées : oui, ou une règle sur la ligne.
validate	(value: V | null, row: Readonly<T>, context: unknown) => …	Votre propre contrôle d’une valeur modifiée : un code de refus, ou null.
edit	EditChecks<T, V>	Les contrôles simples d’une valeur modifiée, et le champ qui la modifie.