Files
LoreMind/web/src/app/shared/dynamic-fields-form/dynamic-fields-form.component.html
IETM_FIXE\ietm6 23878f1c63 Migration Angular 20 -> 21 : fin de la migration securite (0 vulnerabilite npm)
- ng update @angular/core@21 @angular/cli@21 (corrige GHSA-jrmj-c5cx-3cw6, XSS SVG)
- Migration automatique des templates vers le control flow natif (@if/@for, 138 fichiers)
- Correction des 5 `track` invalides generes par la migration (trackBy a 1 argument
  -> track $index) + suppression des fonctions trackBy mortes
- TypeScript 5.9, zone.js 0.15 ; npm audit : 0 vulnerabilite

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-10 14:55:36 +02:00

65 lines
2.1 KiB
HTML

@if (fields?.length) {
<div class="dff">
@for (f of fields; track trackByName($index, f)) {
<div class="dff-field">
<label>{{ f.name }}</label>
@switch (f.type) {
@case ('TEXT') {
<textarea
rows="4"
[ngModel]="values[f.name] || ''"
(ngModelChange)="onTextChange(f, $event)"
[name]="'val-' + f.name"
placeholder="Renseignez {{ f.name }}…">
</textarea>
}
@case ('NUMBER') {
<input
type="number"
[ngModel]="values[f.name] || ''"
(ngModelChange)="onTextChange(f, $event)"
[name]="'val-' + f.name"
placeholder="0"
/>
}
@case ('IMAGE') {
<app-image-gallery
[editable]="true"
[layout]="f.layout || 'GALLERY'"
[imageIds]="imagesFor(f)"
(imageIdsChange)="onImageIdsChange(f, $event)">
</app-image-gallery>
}
<!-- KEY_VALUE_LIST : grille d'inputs avec labels figes du template -->
@case ('KEY_VALUE_LIST') {
<div class="dff-kv-grid">
@for (lbl of f.labels; track trackByLabel($index, lbl)) {
<div class="dff-kv-cell">
<span class="dff-kv-label">{{ lbl }}</span>
<input
type="text"
[ngModel]="kvValue(f, lbl)"
(ngModelChange)="onKvChange(f, lbl, $event)"
[name]="'kv-' + f.name + '-' + lbl"
placeholder="—"
/>
</div>
}
@if (!f.labels?.length) {
<div class="dff-kv-empty">
Aucun label defini dans le template pour ce champ.
</div>
}
</div>
}
}
</div>
}
</div>
} @else {
<div class="dff-empty">
Aucun champ defini dans le template de ce systeme. Editez le GameSystem pour ajouter des champs.
</div>
}