Aller au contenu principal

13-2 Traduction et ressources pour les vues

Pour que les vues utilisent les fichiers de ressource, on peut utiliser IViewLocalizer.

Il s'agit d'une classe permettant de récupérer automatiquement un fichier ressource associé à la vue en se basant sur le nom de cette dernière. Un peu comme les DataAnnotation et les validations au niveau du ViewModel.

Créer un dossier Resources​

Nous avons configuré dans Program.cs que le dossier contenant les ressources sera le dossier Resources:

Snowfall.Web.Mvc/Program.cs
builder.Services.AddLocalization(options => options.ResourcesPath = "Resources");
  1. Sous le projet Snowfall.Web.Mvc, clic droit -> Add -> Directory
  2. Nommez le dossier Resources

Créer un fichier ressource​

  1. Sous le dossier Snowfall.Web.Mvc/Resources, créez un dossier Views
  2. Sous le dossier Snowfall.Web.Mvc/Resources/Views, créez un dossier Evenements
  3. Créez un fichier resource sous ce nouveau dossier Evenements. Nommez le fichier Index.resx: img
info

Le fichier ressource associé à une vue doit avoir la même hiérarchie de dossier et de nom de fichier!

Si la vue est dans le dossier Views/Evenements et que la vue s'appelle Index, le fichier ressource doit être dans Resources/Views/Evenements/Index.resx.

Modifier un fichier ressource​

  1. Pour modifier un fichier ressource, double-cliquez sur le fichier Index.resx et cela vous ouvrira la vue Designer. img
  2. Ensuite, appuyez sur le + pour créer une nouvelle entrée. img
  3. Donnez un nom à ce que vous désirez représenter comme libellé. Pour l'instant, créons une clé Titre pour contenir le titre de la page. img
  4. Ensuite, dans Default Culture, vous entrez la valeur que vous désirez pour cette clé. Par exemple, Événements (ce sera le titre de la page). img
À propos de DefaultCulture

DefaultCulture est la langue par défaut utilisé par le site. Nous pourrons ajouter des langues supplémentaires un peu plus tard.

Utiliser les fichiers dans les vues​

  1. Dans l'en-tête de la vue Snowfall.Web.Mvc/Views/Evenements/Index.cshtml, injectez le IViewLocalizer:

    Snowfall.Web.Mvc/Views/Evenements/Index.cshtml
    @using Microsoft.AspNetCore.Mvc.Localization
    @using Microsoft.AspNetCore.Mvc.TagHelpers
    @model EvenementsIndexViewModel
    @inject IViewLocalizer ViewLocalizer

    @{
        ViewBag.Title = "Événements";
    }

    <h1>Événements</h1>

    <!-- ... -->

  2. Finalement, on peut simplement remplacer le texte par une référence à la bonne propriété via ViewLocalizer[]:

    Snowfall.Web.Mvc/Views/Evenements/Index.cshtml
    <!-- ... -->

    @{
        ViewBag.Title = ViewLocalizer["Titre"];
    }

    <h1>@ViewLocalizer["Titre"]</h1>

    <!-- ... -->

Voilà, rendez-vous à la page d'accueil (la liste des événements) et le tout devrait fonctionner. En effet, le titre devrait être affiché comme auparavant, mais ce dernier vient maintenant du fichier ressource!

Vues partielles​

Le principe est le même pour les vues partielles, mais assurez-vous de nommer le fichier ressource de la même façon que la vue partielle: avec une barre de surlignement en avant.

Par exemple, pour la vue partielle contenant les filtres, on pourrait avoir un fichier de ressource sous Snowfall.Web.Mvc/Resources/Views/Evenements/_Filtres.resx, avec un libellé pour le bouton Bouton_Filtrer:

img