LgLabel

LgLabel affiche un libellé (<label>) dont le texte passe par le dictionnaire de traduction (clés #MaCle). Il peut être associé à un champ par l'attribut For et porter une bulle d'aide.

<LgLabel Text="#CustomerName" For="customer-name" />

• Espace de noms : Lagoon.UI.Components
• Hérite de : LgComponentBase
• Package NuGet : Lagoon.UI

Champs de formulaire

Les champs Lagoon (LgTextBox, LgSelect…) affichent déjà leur libellé via leur paramètre Label : LgLabel sert aux libellés autonomes, hors champ de formulaire Lagoon.

Utilisation

Libellé traduit

Text accepte un texte brut ou une clé de dictionnaire. ChildContent permet un contenu riche ; si Text et ChildContent sont fournis, le texte est rendu avant le contenu.

SummaryPage.razor

<LgLabel Text="#TotalAmount" />

<LgLabel Text="#Status">
    <LgIcon IconName="@IconNames.All.CheckCircleFill" CssClass="text-success" />
</LgLabel>

Association à un champ

For renseigne l'attribut for du <label> : le clic sur le libellé donne le focus à l'élément cible (et la propagation du clic est stoppée).

ConsentPage.razor

<input type="checkbox" id="consent" @bind="_consent" />
<LgLabel Text="#IAgree" For="consent" Tooltip="#ConsentDetails" />

ConsentPage.razor.cs

public partial class ConsentPage : LgPage
{
    // Consentement de l'utilisateur, lié à la case à cocher native.
    private bool _consent;
}

Propriétés

Toutes les propriétés [Parameter] du composant.

Nom	Type	Défaut	Déclaré dans	Description
AdditionalAttributes	IReadOnlyDictionary<string, object>	null	LgLabel	Attributs HTML additionnels appliqués au <label> rendu.
ChildContent	RenderFragment	null	LgLabel	Contenu personnalisé du libellé (rendu après Text si les deux sont fournis).
CssClass	string	null	LgLabel	Classes CSS additionnelles.
For	string	null	LgLabel	Identifiant de l'élément associé (attribut for).
Text	string	null	LgLabel	Texte du libellé (texte brut ou clé de dictionnaire #MaCle).
Tooltip	string	null	LgLabel	Bulle d'aide.
TooltipIsHtml	bool	false	LgLabel	Indique si le contenu du Tooltip est au format HTML (sinon texte brut).

Bonnes pratiques / accessibilité

• Renseignez For dès que le libellé décrit un champ : l'association bénéficie aux lecteurs d'écran et au clic.
• Pour un libellé qui déclenche une action, utilisez LgLabelAction.

Référence complète

Tous les paramètres : Référence API — LgLabel.

Composants liés

• LgLabelAction — libellé associé à un bouton d'action.
• LgTitle — titre de section (h1 à h6).
• LgIcon — icône pouvant accompagner un libellé.