meta données pour cette page
  •  

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
certif:procedure:develop:angular:validator [2026/03/13 16:20] – [Les différents dx-validator] nicolascertif:procedure:develop:angular:validator [2026/03/13 17:05] (Version actuelle) – [L'organisation des tests] nicolas
Ligne 17: Ligne 17:
   * [[certif:procedure:develop:angular:validator-detail]]   * [[certif:procedure:develop:angular:validator-detail]]
   * les validateurs "custum" **doivent** être déclaré dans la bibliothèque dans **custom-validation-rule.ts** et donc appelé via le service **customValidatorService**     * les validateurs "custum" **doivent** être déclaré dans la bibliothèque dans **custom-validation-rule.ts** et donc appelé via le service **customValidatorService**  
-==== Les différents validateur ====+  * [[certif:procedure:develop:angular:validator-date]]
  
-^ Type ^ Description ^ Attributs principaux ^ +===== L'organisation des tests ===== 
-| required | Rend le champ obligatoire. | message | +Comme on l'a vu plus haut les validators sont regroupés en **validationGroup**\\ 
-| range | Vérifie qu'une valeur est comprise entre deux bornes (dates ou nombres). | min, max, message | +Dans le composant on va déclaré une série de procédures (pour une meilleur lecture on essaye de garder la nomenclature)
-| stringLength | Contrôle le nombre de caractères. | min, max, trim, message | +
-| pattern | Valide la saisie via une expression régulière (Regex). | pattern (ex: /[0-9]/), message | +
-| email | Vérifie que le format correspond à une adresse email. | message | +
-| compare | Compare la valeur avec un autre champ ou une constante. | comparisonTarget (fonction), comparisonType, message | +
-| numeric | Vérifie que la valeur est un nombre. | message | +
-| custom | Permet de créer une logique métier complexe en TypeScript. | validationCallback, message, reevaluate | +
-| async | Pour les validations nécessitant un appel API (ex: vérification unicité). | validationCallback (doit retourner une Promise/Observable) | +
- +
-Détails techniques des règles +
-==== Required (Obligatoire) ==== +
-C'est le plus commun. Il vérifie que la valeur n'est ni ''null'', ni ''undefined'', ni une chaîne vide.+
 <code> <code>
-<dxi-validation-rule type="required" message="Le nom est requis"></dxi-validation-rule> +  private Notification= inject(NotificationService)  
-</code> +   
- +  ngAfterViewInit() { 
-==== Range (Plage de valeurs) ==== +    //votre code ici si besoin 
-Indispensable pour les dates de naissance ou les montants. +    this.triggerValidation(); 
- +  }
-min : Valeur minimum autorisée. +
- +
-max : Valeur maximum autorisée. +
- +
-<code> +
-<dxi-validation-rule type="range" [max]="today" message="Date invalide"></dxi-validation-rule> +
-</code> +
- +
-==== Pattern (Regex) ==== +
-Idéal pour les codes postaux, numéros de téléphone ou formats spécifiques (IBAN). +
-<code> +
-<dxi-validation-rule type="pattern" pattern="^[0-9]{5}$" message="Code postal invalide"></dxi-validation-rule> +
-</code> +
- +
-==== Custom (Personnalisé) ==== +
-Utilisé quand les règles standards ne suffisent pas. La fonction de callback reçoit un objet contenant la valeur. +
-<code> +
-<dxi-validation-rule type="custom" [validationCallback]="maFonctionTS" message="Erreur métier"></dxi-validation-rule> +
-</code> +
- +
-==== Async (Asynchrone) ==== +
-Utilisé pour vérifier une donnée sur le serveur sans bloquer l'interface. +
-<code> +
-<dxi-validation-rule type="async" [validationCallback]="checkUserExists" message="Déjà utilisé"></dxi-validation-rule> +
-</code> +
- +
-Propriétés communes à toutes les règles +
-message : Le texte qui sera affiché dans le résumé d'erreurs (votre Toast). +
- +
-ignoreEmptyValue : (Boolean) Si ''true'', la règle n'est pas testée si le champ est vide (sauf pour la règle ''required'').+
  
-reevaluate : (Boolean) Force la règle à se re-valider même si la valeur n'a pas changé (utile pour les comparaisons entre deux champs).+  private triggerValidation() { 
 +    this.Notification.analyseStockValidation("infoBanque","Information bancaires"); 
 +  } 
 +   
 +  handleInfoBanqueChanged() { 
 +    // votre code si beoin 
 +    this.triggerValidation(); 
 +    this.infoBancairesChange.emit(JSON.stringify(this.infoBanque)) 
 +  } 
 +  </code> 
 +==== Le service "Notification" ==== 
 +Il publie plusieurs fonctions : 
 +|analyseStockValidation(validateGroup:string, nomBloc:string)|**validateGroup** est le nom du groupe de test (on peut en avoir plusieurs dans un même composant)\\ **nomBloc** sert à l'affichage à indiquer à l'utilisateur ou se trouve les champs à corriger|