Tag Helper Partial dans ASP.NET CorePartial Tag Helper in ASP.NET Core

Par Scott AddieBy Scott Addie

Pour avoir une vue d’ensemble des Tag Helpers, consultez Tag Helpers dans ASP.NET Core.For an overview of Tag Helpers, see Tag Helpers dans ASP.NET Core.

Affichez ou téléchargez l’exemple de code (procédure de téléchargement)View or download sample code (how to download)

Vue d'ensembleOverview

Le Tag Helper Partial est utilisé dans le cadre du rendu d’une vue partielle dans les pages Razor et les applications MVC.The Partial Tag Helper is used for rendering a partial view in Razor Pages and MVC apps. Tenez compte des points suivants :Consider that it:

  • Il nécessite ASP.NET Core 2.1 ou ultérieur.Requires ASP.NET Core 2.1 or later.
  • Il constitue une alternative à la syntaxe HTML Helper.Is an alternative to HTML Helper syntax.
  • Il affiche la vue partielle de façon asynchrone.Renders the partial view asynchronously.

Parmi les options HTML Helper utilisées pour le rendu d’une vue partielle, citons les suivantes :The HTML Helper options for rendering a partial view include:

Le modèle Product est utilisé dans les exemples tout au long de ce document :The Product model is used in samples throughout this document:

namespace TagHelpersBuiltIn.Models
{
    public class Product
    {
        public int Number { get; set; }

        public string Name { get; set; }

        public string Description { get; set; }
    }
}

Voici l’inventaire des attributs du Tag Helper Partial.An inventory of the Partial Tag Helper attributes follows.

namename

L'attribut name est obligatoire.The name attribute is required. Il indique le nom ou le chemin de la vue partielle à afficher.It indicates the name or the path of the partial view to be rendered. Quand un nom de vue partielle est fourni, le processus de découverte de vue est lancé.When a partial view name is provided, the view discovery process is initiated. Ce processus est ignoré quand un chemin explicite est fourni.That process is bypassed when an explicit path is provided. Pour connaître toutes les valeurs name acceptables, consultez Découverte des vues partielles.For all acceptable name values, see Partial view discovery.

Le balisage suivant utilise un chemin explicite indiquant que le fichier _ProductPartial.cshtml doit être chargé à partir du dossier Shared.The following markup uses an explicit path, indicating that _ProductPartial.cshtml is to be loaded from the Shared folder. À l’aide de l’attribut for, un modèle est passé à la vue partielle pour liaison.Using the for attribute, a model is passed to the partial view for binding.

<partial name="Shared/_ProductPartial.cshtml" for="Product">

forfor

L’attribut for affecte un ModelExpression à évaluer par rapport au modèle actif.The for attribute assigns a ModelExpression to be evaluated against the current model. ModelExpression déduit la syntaxe @Model..A ModelExpression infers the @Model. syntax. Par exemple, for="Product" peut être utilisé à la place de for="@Model.Product".For example, for="Product" can be used instead of for="@Model.Product". Pour substituer ce comportement d’inférence par défaut, utilisez le symbole @ pour définir une expression inline.This default inference behavior is overridden by using the @ symbol to define an inline expression.

Le balisage suivant charge _ProductPartial.cshtml :The following markup loads _ProductPartial.cshtml:

<partial name="_ProductPartial" for="Product">

La vue partielle est liée à la propriété Product du modèle de page associé :The partial view is bound to the associated page model's Product property:

using Microsoft.AspNetCore.Mvc.RazorPages;
using TagHelpersBuiltIn.Models;

namespace TagHelpersBuiltIn.Pages
{
    public class ProductModel : PageModel
    {
        public Product Product { get; set; }

        public void OnGet()
        {
            Product = new Product
            {
                Number = 1,
                Name = "Test product",
                Description = "This is a test product"
            };
        }
    }
}

modèlemodel

L’attribut model affecte une instance de modèle à passer à la vue partielle.The model attribute assigns a model instance to pass to the partial view. L’attribut model ne peut pas être utilisé avec l’attribut for.The model attribute can't be used with the for attribute.

Dans le balisage suivant, un nouvel objet Product est instancié et passé à l’attribut model pour liaison :In the following markup, a new Product object is instantiated and passed to the model attribute for binding:

<partial name="_ProductPartial"
         model='new Product { Number = 1, Name = "Test product", Description = "This is a test" }'>

view-dataview-data

L’attribut view-data affecte un ViewDataDictionary à passer à la vue partielle.The view-data attribute assigns a ViewDataDictionary to pass to the partial view. Le balisage suivant rend l’ensemble de la collection ViewData accessible à la vue partielle :The following markup makes the entire ViewData collection accessible to the partial view:

@{
    ViewData["IsNumberReadOnly"] = true;
}

<partial name="_ProductViewDataPartial" for="Product" view-data="ViewData">

Dans le code précédent, la valeur de clé IsNumberReadOnly est true et ajoutée à la collection ViewData.In the preceding code, the IsNumberReadOnly key value is set to true and added to the ViewData collection. ViewData["IsNumberReadOnly"] est donc accessible au sein de la vue partielle suivante :Consequently, ViewData["IsNumberReadOnly"] is made accessible within the following partial view:

@model TagHelpersBuiltIn.Models.Product

<div class="form-group">
    <label asp-for="Number"></label>
    @if ((bool)ViewData["IsNumberReadOnly"])
    {
        <input asp-for="Number" type="number" class="form-control" readonly />
    }
    else
    {
        <input asp-for="Number" type="number" class="form-control" />
    }
</div>
<div class="form-group">
    <label asp-for="Name"></label>
    <input asp-for="Name" type="text" class="form-control" />
</div>
<div class="form-group">
    <label asp-for="Description"></label>
    <textarea asp-for="Description" rows="4" cols="50" class="form-control"></textarea>
</div>

Dans cet exemple, la valeur de ViewData["IsNumberReadOnly"] détermine si le champ Number s’affiche en lecture seule.In this example, the value of ViewData["IsNumberReadOnly"] determines whether the Number field is displayed as read only.

Migrer à partir d’une assistance HTMLMigrate from an HTML Helper

Prenons l’exemple d’assistance HTML asynchrone suivante.Consider the following asynchronous HTML Helper example. Une collection de produits est parcourue et affichée.A collection of products is iterated and displayed. Conformément au premier paramètre de la méthode PartialAsync, la vue partielle _ProductPartial.cshtml est chargée.Per the PartialAsync method's first parameter, the _ProductPartial.cshtml partial view is loaded. Une instance du modèle Product est passée à la vue partielle pour la liaison.An instance of the Product model is passed to the partial view for binding.

@foreach (var product in Model.Products)
{
    @await Html.PartialAsync("_ProductPartial", product)
}

Le Tag Helper Partial suivant permet d’obtenir le même comportement de rendu asynchrone que l’assistance HTML PartialAsync.The following Partial Tag Helper achieves the same asynchronous rendering behavior as the PartialAsync HTML Helper. Une instance de modèle Product est assignée à l’attribut model pour la liaison à la vue partielle.The model attribute is assigned a Product model instance for binding to the partial view.

@foreach (var product in Model.Products)
{
    <partial name="_ProductPartial" model="product" />
}

Ressources supplémentairesAdditional resources