Sdílet prostřednictvím


Razor Referenční informace o syntaxi pro ASP.NET Core

Autor: Rick Anderson, Taylor Mullen a Dan Vicarel

Razor je syntaxe značek pro vkládání kódu založeného na .NET na webové stránky. Syntaxe Razor se skládá ze značek Razor, jazyka C# a HTML. Soubory obsahující Razor obecně mají příponu .cshtml souboru. Razor je také nalezen v Razor souborech komponent (.razor). Razor syntaxe se podobá šablonovacím modulům různých architektur jednostránkové aplikace JavaScriptu (SPA), jako jsou Angular, React, VueJs a Svelte. Další informace naleznete v části "Funkce popsané v tomto článku jsou zastaralé od ASP.NET Core 3.0".

Úvod do ASP.NET webového programování pomocí Razor syntaxe poskytuje mnoho ukázek programování pomocí Razor syntaxe. I když téma bylo napsané pro ASP.NET místo ASP.NET Core, většina ukázek se vztahuje na ASP.NET Core.

Vykreslování HTML

Výchozí Razor jazyk je HTML. Vykreslování HTML ze Razor značkování se nijak neliší od vykreslování HTML ze souboru HTML. Kód HTML v .cshtmlRazor souborech se vykreslí serverem beze změny.

Syntaxe Razor

Razor podporuje jazyk C# a používá @ symbol k přechodu z HTML na C#. Razor vyhodnotí výrazy jazyka C# a vykreslí je ve výstupu HTML.

@ Když za symbolem následuje Razor rezervované klíčové slovo, přejde na Razor značky specifické pro daný typ. V opačném případě se převede do prostého HTML.

Pokud chcete uchvátit @ symbol ve Razor značkách, použijte druhý @ symbol:

<p>@@Username</p>

Kód se vykreslí ve formátu HTML s jedním @ symbolem:

<p>@Username</p>

Atributy HTML a obsah obsahující e-mailové adresy nezachází se @ symbolem jako s přechodovým znakem. E-mailové adresy v následujícím příkladu nejsou parsováním nedotčené Razor :

<a href="mailto:Support@contoso.com">Support@contoso.com</a>

SvG (Scalable Vector Graphics)

Podporují se elementy SVGforeignObject :

@{
    string message = "foreignObject example with Scalable Vector Graphics (SVG)";
}

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
    <rect x="0" y="0" rx="10" ry="10" width="200" height="200" stroke="black" 
        fill="none" />
    <foreignObject x="20" y="20" width="160" height="160">
        <p>@message</p>
    </foreignObject>
</svg>

Implicitní Razor výrazy

Implicitní Razor výrazy začínají @, po kterých následuje kód jazyka C#.

<p>@DateTime.Now</p>
<p>@DateTime.IsLeapYear(2016)</p>

S výjimkou klíčového slova jazyka C# await nesmí implicitní výrazy obsahovat mezery. Pokud má příkaz jazyka C# jasné ukončení, mezery mohou být prokládány.

<p>@await DoSomething("hello", "world")</p>

Implicitní výrazy nemohou obsahovat obecné typy jazyka C#, protože znaky uvnitř závorek (<>) jsou interpretovány jako značka HTML. Následující kód není platný:

<p>@GenericMethod<int>()</p>

Předchozí kód vygeneruje chybu kompilátoru podobnou jedné z následujících:

  • Prvek "int" nebyl zavřený. Všechny prvky musí být buď samozavírací, nebo musí mít odpovídající koncovou značku.
  • Nelze převést skupinu metod GenericMethod na typ "object", který není delegován. Chtěli jste vyvolat metodu?

Volání obecné metody musí být zabalené do explicitního výrazu nebo bloku kódu.

Explicitní Razor výrazy

Explicitní Razor výrazy se skládají ze symbolu @ s vyváženou závorkou. K vykreslení času posledního týdne se používá následující Razor kód:

<p>Last week this time: @(DateTime.Now - TimeSpan.FromDays(7))</p>

Veškerý obsah v závorkách @() se vyhodnotí a vykreslí do výstupu.

Implicitní výrazy popsané v předchozí části obecně nemohou obsahovat mezery. V následujícím kódu se od aktuálního času neodčítá jeden týden:

<p>Last week: @DateTime.Now - TimeSpan.FromDays(7)</p>

Kód vykreslí následující kód HTML:

<p>Last week: 7/7/2016 4:39:52 PM - TimeSpan.FromDays(7)</p>

Výslovné výrazy lze použít ke spojení textu s výsledkem výrazu:

@{
    var joe = new Person("Joe", 33);
}

<p>Age@(joe.Age)</p>

Bez explicitního výrazu se <p>Age@joe.Age</p> považuje za e-mailovou adresu a <p>Age@joe.Age</p> je vykresleno. Při zápisu jako explicitní výraz se <p>Age33</p> vykreslí.

Explicitní výrazy lze použít k vykreslení výstupu z obecných metod v .cshtml souborech. Následující kód ukazuje, jak opravit chybu zobrazenou dříve způsobenou hranatými závorkami obecného jazyka C#. Kód se zapíše jako explicitní výraz:

<p>@(GenericMethod<int>())</p>

Kódování výrazů

Výrazy jazyka C#, které se vyhodnotí jako řetězec, jsou kódovány kódem HTML. Výrazy jazyka C#, které se vyhodnotí jako IHtmlContent , se vykreslují přímo přes IHtmlContent.WriteTo. Výrazy jazyka C#, které se nevyhodnocují na IHtmlContent, jsou ToString převedeny na řetězec a zakódovány před vykreslením.

@("<span>Hello World</span>")

Předchozí kód vykreslí následující kód HTML:

&lt;span&gt;Hello World&lt;/span&gt;

Html se v prohlížeči zobrazuje jako prostý text:

<span>Hello World</span>

HtmlHelper.Raw výstup není kódovaný, ale vykreslený jako kód HTML.

Varování

Použití HtmlHelper.Raw na nesanitizovaném vstupu uživatele představuje bezpečnostní riziko. Uživatelský vstup může obsahovat škodlivý JavaScript nebo jiné zneužití. Sanitizace uživatelského vstupu je obtížná. Vyhněte se používání HtmlHelper.Raw s uživatelským vstupem.

@Html.Raw("<span>Hello World</span>")

Kód vykreslí následující kód HTML:

<span>Hello World</span>

Razor bloky kódu

Razor bloky kódu začínají @ a jsou uzavřeny {}. Na rozdíl od výrazů se kód jazyka C# uvnitř bloků kódu nevykreslí. Bloky kódu a výrazy v zobrazení sdílejí stejný obor a jsou definovány v pořadí:

@{
    var quote = "The future depends on what you do today. - Mahatma Gandhi";
}

<p>@quote</p>

@{
    quote = "Hate cannot drive out hate, only love can do that. - Martin Luther King, Jr.";
}

<p>@quote</p>

Kód vykreslí následující kód HTML:

<p>The future depends on what you do today. - Mahatma Gandhi</p>
<p>Hate cannot drive out hate, only love can do that. - Martin Luther King, Jr.</p>

V blocích kódu deklarujte místní funkce pomocí značkování, které bude sloužit jako metody šablon.

@{
    void RenderName(string name)
    {
        <p>Name: <strong>@name</strong></p>
    }

    RenderName("Mahatma Gandhi");
    RenderName("Martin Luther King, Jr.");
}

Kód vykreslí následující kód HTML:

<p>Name: <strong>Mahatma Gandhi</strong></p>
<p>Name: <strong>Martin Luther King, Jr.</strong></p>

Implicitní přechody

Výchozí jazyk bloku kódu je C#, ale Razor stránka se může vrátit zpět do HTML:

@{
    var inCSharp = true;
    <p>Now in HTML, was in C# @inCSharp</p>
}

Explicitní oddělený přechod

Pokud chcete definovat pododdíl bloku kódu, který by měl vykreslit kód HTML, ohraničujte znaky pro vykreslení značkou Razor<text> :

@for (var i = 0; i < people.Length; i++)
{
    var person = people[i];
    <text>Name: @person.Name</text>
}

Tento přístup použijte k vykreslení kódu HTML, který není obklopen značkou HTML. Bez značky HTML nebo Razor dojde k chybě za běhu Razor.

Značka <text> je užitečná k řízení prázdných znaků při vykreslování obsahu:

  • Vykreslí se jenom obsah mezi značkou <text> .
  • Ve výstupu HTML se nezobrazí žádné prázdné znaky před nebo za značkou <text> .

Explicitní přechod čáry

Pokud chcete vykreslit zbytek celého řádku jako HTML uvnitř bloku kódu, použijte syntaxi @::

@for (var i = 0; i < people.Length; i++)
{
    var person = people[i];
    @:Name: @person.Name
}

@: Bez kódu Razor se vygeneruje chyba modulu runtime.

Nadbytečné @ znaky v Razor souboru můžou způsobit chyby kompilátoru v příkazech později v bloku. Tyto další @ chyby kompilátoru:

  • Může být obtížné pochopit, protože skutečná chyba nastane před nahlášenou chybou.
  • Je běžné po kombinování více implicitních a explicitních výrazů do jednoho bloku kódu.

Vykreslování podmíněného atributu

Razor automaticky vynechá atributy, které nejsou potřeba. Pokud je předaná hodnota null nebo false, atribut se nevykreslí.

Představte si například následující břitvu:

<div class="@false">False</div>
<div class="@null">Null</div>
<div class="@("")">Empty</div>
<div class="@("false")">False String</div>
<div class="@("active")">String</div>
<input type="checkbox" checked="@true" name="true" />
<input type="checkbox" checked="@false" name="false" />
<input type="checkbox" checked="@null" name="null" />

Předchozí Razor kód vygeneruje následující kód HTML:

<div>False</div>
<div>Null</div>
<div class="">Empty</div>
<div class="false">False String</div>
<div class="active">String</div>
<input type="checkbox" checked="checked" name="true">
<input type="checkbox" name="false">
<input type="checkbox" name="null">

Řídicí struktury

Řídicí struktury jsou rozšířením bloků kódu. Všechny aspekty bloků kódu (přechod na značkovací jazyk, vložený C#) se vztahují také na následující struktury:

Podmínky @if, else if, else, and @switch

@if ovládací prvky při spuštění kódu:

@if (value % 2 == 0)
{
    <p>The value was even.</p>
}

else a else if nevyžadují @ symbol:

@if (value % 2 == 0)
{
    <p>The value was even.</p>
}
else if (value >= 1337)
{
    <p>The value is large.</p>
}
else
{
    <p>The value is odd and small.</p>
}

Následující kód ukazuje, jak použít příkaz switch:

@switch (value)
{
    case 1:
        <p>The value is 1!</p>
        break;
    case 1337:
        <p>Your number is 1337!</p>
        break;
    default:
        <p>Your number wasn't 1 or 1337.</p>
        break;
}

Smyčkování @for, @foreach, @while, and @do while

Šablona HTML lze vykreslit pomocí příkazů ovládacího prvku smyčky. Vykreslení seznamu osob:

@{
    var people = new Person[]
    {
          new Person("Weston", 33),
          new Person("Johnathon", 41),
          ...
    };
}

Jsou podporovány následující příkazy smyčky:

@for

@for (var i = 0; i < people.Length; i++)
{
    var person = people[i];
    <p>Name: @person.Name</p>
    <p>Age: @person.Age</p>
}

@foreach

@foreach (var person in people)
{
    <p>Name: @person.Name</p>
    <p>Age: @person.Age</p>
}

@while

@{ var i = 0; }
@while (i < people.Length)
{
    var person = people[i];
    <p>Name: @person.Name</p>
    <p>Age: @person.Age</p>

    i++;
}

@do while

@{ var i = 0; }
@do
{
    var person = people[i];
    <p>Name: @person.Name</p>
    <p>Age: @person.Age</p>

    i++;
} while (i < people.Length);

Složenina @using

V jazyce C# using se k zajištění odstranění objektu používá příkaz. Ve Razor se používá stejný mechanismus pro vytvoření HTML pomocníků, které obsahují další obsah. V následujícím kódu pomocné funkce HTML vykreslí značku <form> pomocí příkazu @using:

@using (Html.BeginForm())
{
    <div>
        <label>Email: <input type="email" id="Email" value=""></label>
        <button>Register</button>
    </div>
}

@try, catch, finally

Zpracování výjimek je podobné jazyku C#:

@try
{
    throw new InvalidOperationException("You did something invalid.");
}
catch (Exception ex)
{
    <p>The exception message: @ex.Message</p>
}
finally
{
    <p>The finally statement.</p>
}

@lock

Razor má schopnost chránit kritické oddíly pomocí příkazů lock:

@lock (SomeLock)
{
    // Do critical section work
}

Komentáře

Razor podporuje komentáře jazyka C# a HTML:

@{
    /* C# comment */
    // Another C# comment
}
<!-- HTML comment -->

Kód vykreslí následující kód HTML:

<!-- HTML comment -->

Razor komentáře jsou serverem odebrány před vykreslením webové stránky. Razor používá @* *@ k oddělovači komentářů. Následující kód je v komentáři, takže server nevykresluje žádný kód.

@*
    @{
        /* C# comment */
        // Another C# comment
    }
    <!-- HTML comment -->
*@

Direktivy

Razor direktivy jsou reprezentovány implicitními výrazy s vyhrazenými klíčovými slovy za @ symbolem. Direktiva obvykle mění způsob kompilace zobrazení nebo funkcí.

Pochopení toho, jak Razor generuje kód pro zobrazení, usnadňuje pochopení fungování direktiv.

@{
    var quote = "Getting old ain't for wimps! - Anonymous";
}

<div>Quote of the Day: @quote</div>

Kód vygeneruje třídu podobnou následující:

public class _Views_Something_cshtml : RazorPage<dynamic>
{
    public override async Task ExecuteAsync()
    {
        var output = "Getting old ain't for wimps! - Anonymous";

        WriteLiteral("/r/n<div>Quote of the Day: ");
        Write(output);
        WriteLiteral("</div>");
    }
}

Dále v tomto článku část Kontrola třídy jazyka Razor C# vygenerovaná pro zobrazení vysvětluje, jak zobrazit tuto vygenerovanou třídu.

@attribute

Direktiva @attribute přidá daný atribut do třídy vygenerované stránky nebo zobrazení. Následující příklad přidá [Authorize] atribut:

@attribute [Authorize]

Direktivu @attribute lze také použít k zadání šablony trasy založené na konstantě v komponentě Razor . V následujícím příkladu se direktiva @page v komponentě nahrazuje @attribute direktivou a šablonou trasy založenou na konstantě, Constants.CounterRoutekterá je nastavena jinde v aplikaci na "/counter":

- @page "/counter"
+ @attribute [Route(Constants.CounterRoute)]

@code

Tento scénář platí jenom pro Razor komponenty (.razor).

Blok @code umožňuje komponentě Razor přidat členy jazyka C# (pole, vlastnosti a metody) do komponenty:

@code {
    // C# members (fields, properties, and methods)
}

Pro Razor komponenty je @code aliasem @functions a doporučuje se používat místo @functions. Je povoleno více než jeden @code blok.

@functions

Direktiva @functions umožňuje přidání členů jazyka C# (pole, vlastnosti a metody) do vygenerované třídy:

@functions {
    // C# members (fields, properties, and methods)
}

Použijte @code místo @functions, abyste přidali členy jazyka C# v Razor komponentách.

Příklad:

@functions {
    public string GetHello()
    {
        return "Hello";
    }
}

<div>From method: @GetHello()</div> 

Kód vygeneruje následující kód HTML:

<div>From method: Hello</div>

Následující kód je vygenerovaná Razor třída jazyka C#:

using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc.Razor;

public class _Views_Home_Test_cshtml : RazorPage<dynamic>
{
    // Functions placed between here 
    public string GetHello()
    {
        return "Hello";
    }
    // And here.
#pragma warning disable 1998
    public override async Task ExecuteAsync()
    {
        WriteLiteral("\r\n<div>From method: ");
        Write(GetHello());
        WriteLiteral("</div>\r\n");
    }
#pragma warning restore 1998

@functions metody slouží jako šablonové metody, pokud mají značky:

@{
    RenderName("Mahatma Gandhi");
    RenderName("Martin Luther King, Jr.");
}

@functions {
    private void RenderName(string name)
    {
        <p>Name: <strong>@name</strong></p>
    }
}

Kód vykreslí následující kód HTML:

<p>Name: <strong>Mahatma Gandhi</strong></p>
<p>Name: <strong>Martin Luther King, Jr.</strong></p>

@implements

Direktiva @implements implementuje rozhraní pro vygenerovanou třídu.

Následující příklad implementuje System.IDisposable, aby bylo možné zavolat metodou Dispose.

@implements IDisposable

<h1>Example</h1>

@functions {
    private bool _isDisposed;

    ...

    public void Dispose() => _isDisposed = true;
}

@inherits

Direktiva @inherits poskytuje úplnou kontrolu nad třídou, kterou zobrazení dědí:

@inherits TypeNameOfClassToInheritFrom

Následující kód je uživatelsky definovaný Razor typ stránky.

using Microsoft.AspNetCore.Mvc.Razor;

public abstract class CustomRazorPage<TModel> : RazorPage<TModel>
{
    public string CustomText { get; } = 
        "Gardyloo! - A Scottish warning yelled from a window before dumping" +
        "a slop bucket on the street below.";
}

CustomText je zobrazen ve výhledu:

@inherits CustomRazorPage<TModel>

<div>Custom text: @CustomText</div>

Kód vykreslí následující kód HTML:

<div>
    Custom text: Gardyloo! - A Scottish warning yelled from a window before dumping
    a slop bucket on the street below.
</div>

@model a @inherits lze použít ve stejném zobrazení. @inherits může být v _ViewImports.cshtml souboru, který pohled importuje.

@inherits CustomRazorPage<TModel>

Následující kód je příkladem silně typovaného zobrazení.

@inherits CustomRazorPage<TModel>

<div>The Login Email: @Model.Email</div>
<div>Custom text: @CustomText</div>

Pokud se v modelu předá "rick@contoso.com", vygeneruje zobrazení následující kód HTML:

<div>The Login Email: rick@contoso.com</div>
<div>
    Custom text: Gardyloo! - A Scottish warning yelled from a window before dumping
    a slop bucket on the street below.
</div>

@inject

Direktiva @injectRazor umožňuje stránkám vložit službu z kontejneru služby do zobrazení. Další informace naleznete v tématu Injektáž závislostí do zobrazení.

@layout

Tento scénář platí jenom pro Razor komponenty (.razor).

Direktiva @layout určuje rozložení směrovatelných Razor komponent, které mají direktivu @page . Komponenty rozložení se používají k zabránění duplikaci kódu a nekonzistence. Další informace najdete v tématu ASP.NET Core Blazor rozložení.

@model

Tento scénář platí jenom pro zobrazení MVC a Razor stránky (.cshtml).

Direktiva @model určuje typ modelu předaného zobrazení nebo stránce:

@model TypeNameOfModel

V aplikaci ASP.NET Core MVC nebo Razor Pages vytvořená pomocí jednotlivých uživatelských účtů Views/Account/Login.cshtml obsahuje následující deklaraci modelu:

@model LoginViewModel

Třída vygenerovaná zdědí z RazorPage<LoginViewModel>:

public class _Views_Account_Login_cshtml : RazorPage<LoginViewModel>

Razor Model zveřejňuje vlastnost pro přístup k modelu předaného do zobrazení:

<div>The Login Email: @Model.Email</div>

Direktiva @model určuje typ Model vlastnosti. Direktiva určuje T v RazorPage<T> vygenerovanou třídu, ze které je zobrazení odvozeno. Pokud není zadána @model direktiva, je vlastnost Model typu dynamic. Další informace najdete na webu Strongly typed models and the @model keyword.

@namespace

Direktiva @namespace :

  • Nastaví jmenný prostor třídy vygenerované Razor stránky, zobrazení MVC nebo Razor komponenty.
  • Nastaví kořenové odvozené obory názvů tříd stránek, zobrazení nebo komponent z nejbližšího importového souboru ve stromu adresářů, _ViewImports.cshtml (zobrazení nebo stránky) nebo _Imports.razor (Razor komponenty).
@namespace Your.Namespace.Here

Příklad stránky Razor zobrazený v následující tabulce:

  • Každá stránka naimportuje Pages/_ViewImports.cshtml.
  • Pages/_ViewImports.cshtml obsahuje @namespace Hello.World.
  • Každá stránka má Hello.World jako kořen názvového prostoru.
Stránka Namespace
Pages/Index.cshtml Hello.World
Pages/MorePages/Page.cshtml Hello.World.MorePages
Pages/MorePages/EvenMorePages/Page.cshtml Hello.World.MorePages.EvenMorePages

Předchozí vztahy platí pro import souborů používaných se zobrazeními a Razor komponentami MVC.

Pokud má více importovaných souborů direktivu @namespace , použije se k nastavení kořenového oboru názvů soubor nejblíže stránce, zobrazení nebo komponentě ve stromu adresáře.

Pokud má EvenMorePages složka v předchozím příkladu soubor importu s @namespace Another.Planet (nebo Pages/MorePages/EvenMorePages/Page.cshtml soubor obsahuje @namespace Another.Planet), výsledek se zobrazí v následující tabulce.

Stránka Obor názvů
Pages/Index.cshtml Hello.World
Pages/MorePages/Page.cshtml Hello.World.MorePages
Pages/MorePages/EvenMorePages/Page.cshtml Another.Planet

@page

Direktiva @page má různé účinky v závislosti na typu souboru, na kterém se zobrazuje. Direktiva:

@preservewhitespace

Tento scénář platí jenom pro Razor komponenty (.razor).

Pokud je možnost nastavena na false (výchozí), odstraní se prázdné znaky ve vykreslených značkách ze součástí Razor (.razor).

  • Na začátku nebo na konci elementu
  • Počáteční nebo koncové hodnoty v rámci parametru RenderFragment Například dětský obsah předaný jiné komponentě.
  • Před nebo za blokem kódu jazyka C#, například @if nebo @foreach

@rendermode

Tento scénář platí jenom pro Razor komponenty (.razor).

Nastaví režim Razor vykreslování komponenty:

  • InteractiveServer: Použije interaktivní vykreslování serveru pomocí Blazor Server.
  • InteractiveWebAssembly: Použije interaktivní vykreslování WebAssembly pomocí Blazor WebAssembly.
  • InteractiveAuto: Zpočátku použije interaktivní vykreslování WebAssembly pomocí Blazor Servera potom použije interaktivní vykreslování WebAssembly pomocí WebAssembly při následných návštěvách po Blazor stažení sady.

Pro instanci komponenty:

<... @rendermode="InteractiveServer" />

V definici komponenty:

@rendermode InteractiveServer

Poznámka:

Blazor šablony obsahují statickou using direktivu pro RenderMode soubor aplikace _Imports (Components/_Imports.razor) pro kratší @rendermode syntaxi:

@using static Microsoft.AspNetCore.Components.Web.RenderMode

Bez předchozí direktivy musí komponenty explicitně zadat statickou RenderMode třídu v @rendermode syntaxi:

<Dialog @rendermode="RenderMode.InteractiveServer" />

Další informace, včetně pokynů k zakázání předběžného vykreslování pomocí direktivy nebo atributu direktivy, najdete v tématu režimy vykreslování v ASP.NET Core.

@section

Tento scénář platí jenom pro zobrazení MVC a Razor stránky (.cshtml).

Direktiva @section se používá ve spojení s rozloženími Razor MVC a Pages, které umožňují zobrazení nebo stránky vykreslovat obsah v různých částech stránky HTML. Další informace najdete v tématu Rozložení v ASP.NET Core.

@typeparam

Tento scénář platí jenom pro Razor komponenty (.razor).

Direktiva @typeparam deklaruje pro generovanou třídu komponenty parametr obecného typu:

@typeparam TEntity

Podporují se obecné typy s omezeními where typu:

@typeparam TEntity where TEntity : IEntity

Další informace najdete v následujících článcích:

@using

Direktiva @using přidá direktivu jazyka C# using do vygenerovaného zobrazení:

@using System.IO
@{
    var dir = Directory.GetCurrentDirectory();
}
<p>@dir</p>

V Razor komponentách@using také řídí, které komponenty jsou v rozsahu.

Atributy direktiv

Razor atributy direktiv jsou reprezentovány implicitními výrazy s vyhrazenými klíčovými slovy za @ symbolem. Atribut direktivy obvykle mění způsob kompilace elementu nebo funkce.

@attributes

Tento scénář platí jenom pro Razor komponenty (.razor).

@attributes umožňuje komponentě vykreslit ne deklarované atributy. Další informace najdete v tématu splatting atributů a libovolných parametrů v ASP.NET Core.

@bind

Tento scénář platí jenom pro Razor komponenty (.razor).

Datová vazba v komponentách se provádí pomocí atributu @bind . Další informace najdete v tématu ASP.NET Core Blazor datová vazba.

@bind:culture

Tento scénář platí jenom pro Razor komponenty (.razor).

Použijte atribut @bind:culture s atributem @bind k poskytnutí System.Globalization.CultureInfo pro analýzu a formátování hodnoty. Další informace najdete v tématu globalizace a lokalizace ASP.NET CoreBlazor..

@formname

Tento scénář platí jenom pro Razor komponenty (.razor).

@formname přiřadí 'Razor' názvu prostému HTML formuláři nebo formuláři na základě komponenty EditForm (Editform dokumentace). Hodnota @formname by měla být jedinečná, což brání kolizím formulářů v následujících situacích:

  • Formulář je umístěn v komponentě s více formuláři.
  • Formulář je zdroj z externí knihovny tříd, obvykle balíček NuGet, pro komponentu s více formuláři a autor aplikace neřídí zdrojový kód knihovny tak, aby nastavil jiný název externího formuláře než název používaný jiným formulářem v komponentě.

Další informace a příklady najdete v přehledu formulářů ASP.NET Core.

@on{EVENT}

Tento scénář platí jenom pro Razor komponenty (.razor).

Razor poskytuje funkce zpracování událostí pro komponenty. Další informace najdete v ASP.NET Core Blazor zpracování událostí.

@on{EVENT}:preventDefault

Tento scénář platí jenom pro Razor komponenty (.razor).

Zamezí provedení výchozí akce pro událost.

@on{EVENT}:stopPropagation

Tento scénář platí jenom pro Razor komponenty (.razor).

Zastaví šíření události.

@key

Tento scénář platí jenom pro Razor komponenty (.razor).

Atribut @key direktivy způsobí, že algoritmus rozdílu komponent zaručuje zachování prvků nebo komponent na základě hodnoty klíče. Další informace naleznete v tématu Zachování elementu, komponenty a relace modelu v ASP.NET Core Blazor.

@ref

Tento scénář platí jenom pro Razor komponenty (.razor).

Odkazy na komponenty (@ref) poskytují způsob, jak odkazovat na instanci komponenty, abyste mohli vydat příkazy pro danou instanci. Další informace najdete v tématu ASP.NET základní Razor komponenty.

Šablonované Razor delegáty

Tento scénář platí jenom pro zobrazení MVC a Razor stránky (.cshtml).

Razor Šablony umožňují definovat fragment kódu uživatelského rozhraní s následujícím formátem:

@<tag>...</tag>

Následující příklad ukazuje, jak zadat templátovaný Razor delegát jako Func<T,TResult>. Dynamický typ je určen pro parametr metody, kterou delegát zapouzdřuje. Typ objektu je určen jako návratová hodnota delegáta. Šablona se používá s List<T> prvkem Pet, který má vlastnost Name.

public class Pet
{
    public string Name { get; set; }
}
@{
    Func<dynamic, object> petTemplate = @<p>You have a pet named <strong>@item.Name</strong>.</p>;

    var pets = new List<Pet>
    {
        new Pet { Name = "Rin Tin Tin" },
        new Pet { Name = "Mr. Bigglesworth" },
        new Pet { Name = "K-9" }
    };
}

Šablona se vykreslí se zadaným pets příkazem foreach :

@foreach (var pet in pets)
{
    @petTemplate(pet)
}

Vykreslený výstup:

<p>You have a pet named <strong>Rin Tin Tin</strong>.</p>
<p>You have a pet named <strong>Mr. Bigglesworth</strong>.</p>
<p>You have a pet named <strong>K-9</strong>.</p>

Vloženou Razor šablonu můžete také zadat jako argument metody. V následujícím příkladu Repeat metoda obdrží Razor šablonu. Metoda používá šablonu k vytvoření obsahu HTML s opakováním položek zadaných ze seznamu:

@using Microsoft.AspNetCore.Html

@functions {
    public static IHtmlContent Repeat(IEnumerable<dynamic> items, int times,
        Func<dynamic, IHtmlContent> template)
    {
        var html = new HtmlContentBuilder();

        foreach (var item in items)
        {
            for (var i = 0; i < times; i++)
            {
                html.AppendHtml(template(item));
            }
        }

        return html;
    }
}

Při použití seznamu domácích zvířat z předchozího příkladu se volá metoda Repeat s:

  • List<T> z Pet.
  • Počet opakování pro každé domácí zvíře
  • Vložená šablona, která se má použít pro položky neuspořádaného seznamu.
<ul>
    @Repeat(pets, 3, @<li>@item.Name</li>)
</ul>

Vykreslený výstup:

<ul>
    <li>Rin Tin Tin</li>
    <li>Rin Tin Tin</li>
    <li>Rin Tin Tin</li>
    <li>Mr. Bigglesworth</li>
    <li>Mr. Bigglesworth</li>
    <li>Mr. Bigglesworth</li>
    <li>K-9</li>
    <li>K-9</li>
    <li>K-9</li>
</ul>

Pomocníci pro značky

Tento scénář platí jenom pro zobrazení MVC a Razor stránky (.cshtml).

Existují tři direktivy, které se týkají pomocníků značek.

Direktiva Funkce
@addTagHelper Zpřístupní pomocníky značek pro zobrazení.
@removeTagHelper Odebere pomocníky značek dříve přidané z pohledu.
@tagHelperPrefix Určuje předponu značky, která povolí podporu pro pomocníky značek a aby bylo používání zřejmé.

Razor rezervovaná klíčová slova

Razor klíčová slova

  • page
  • namespace
  • functions
  • inherits
  • model
  • section
  • helper (V současné době není podporováno službou ASP.NET Core)

Razor klíčová slova jsou uniknuta @(Razor Keyword) (například @(functions)).

Klíčová slova jazyka C# Razor

  • case
  • do
  • default
  • for
  • foreach
  • if
  • else
  • lock
  • switch
  • try
  • catch
  • finally
  • using
  • while

Klíčová slova jazyka C# Razor musí být dvojitě uvozována @(@C# Razor Keyword) (například @(@case)). První @ unikne Razor parseru. @ Druhý unikne analyzátoru jazyka C#.

Vyhrazená klíčová slova nepoužitá Razor

  • class

Zkontrolujte vygenerovanou třídu C# pro zobrazení

Sada Razor SDK zpracovává kompilaci Razor souborů. Ve výchozím nastavení se vygenerované soubory kódu nevydávají. Pokud chcete povolit generování souborů kódu, nastavte EmitCompilerGeneratedFiles direktivu v souboru projektu (.csproj) na true:

<PropertyGroup>
  <EmitCompilerGeneratedFiles>true</EmitCompilerGeneratedFiles>
</PropertyGroup>

Při sestavování projektu verze 6.0 (net6.0) v konfiguraci sestavení Debug, SDK vygeneruje adresář obj/Debug/net6.0/generated/ v kořenovém adresáři projektu. Jeho podadresář obsahuje vygenerované Razor soubory kódu stránky.

Sada Razor SDK zpracovává kompilaci Razor souborů. Když sestavujete projekt, sada SDK vygeneruje adresář obj/{BUILD CONFIGURATION}/{TARGET FRAMEWORK MONIKER}/Razor v kořenovém umístění projektu. Adresářová struktura v rámci Razor adresáře zrcadlí adresářovou strukturu projektu.

V projektu ASP.NET Core Razor Pages 2.1 zvažte následující adresářovou strukturu:

 Areas/
   Admin/
     Pages/
       Index.cshtml
       Index.cshtml.cs
 Pages/
   Shared/
     _Layout.cshtml
   _ViewImports.cshtml
   _ViewStart.cshtml
   Index.cshtml
   Index.cshtml.cs

Sestavení projektu v Debug konfiguraci přináší následující obj adresář:

 obj/
   Debug/
     netcoreapp2.1/
       Razor/
         Areas/
           Admin/
             Pages/
               Index.g.cshtml.cs
         Pages/
           Shared/
             _Layout.g.cshtml.cs
           _ViewImports.g.cshtml.cs
           _ViewStart.g.cshtml.cs
           Index.g.cshtml.cs

Chcete-li zobrazit vygenerovanou třídu pro Pages/Index.cshtml, otevřete obj/Debug/netcoreapp2.1/Razor/Pages/Index.g.cshtml.cs.

Zobrazení citlivosti vyhledávání a velikosti písmen

Modul Razor zobrazení provádí vyhledávání s rozlišováním velkých a malých písmen pro zobrazení. Skutečné vyhledávání je však určeno základním systémem souborů:

  • Zdroj založený na souborech:
    • V operačních systémech, u kterých se nerozlišují malá a velká písmena (například Windows), vyhledávání fyzických poskytovatelů souborů nerozlišují malá a velká písmena. Výsledkem jsou například return View("Test") shody pro /Views/Home/Test.cshtml, /Views/home/test.cshtml a všechny ostatní varianty velikostí.
    • Na systémech souborů rozlišujících malá a velká písmena (například Linux, OSX a s EmbeddedFileProvider) jsou vyhledávání citlivá na velikost písmen. Například konkrétně return View("Test") odpovídá /Views/Home/Test.cshtml.
  • Předkompilovaná zobrazení: U ASP.NET Core 2.0 a novějších verzí je vyhledávání předkompilovaných zobrazení bez rozlišování velkých a malých písmen na všech operačních systémech. Chování je stejné jako chování fyzického poskytovatele souborů ve Windows. Pokud se dvě předkompilovaná zobrazení liší pouze v případě, že výsledek vyhledávání není deterministický.

Vývojářům se doporučuje, aby velikost písmen v názvech souborů a adresářů odpovídala zadanému formátu:

  • Názvy oblastí, kontroleru a akcí
  • Razor Stránky.

Odpovídající případ zajišťuje, že nasazení najdou svá zobrazení bez ohledu na základní systém souborů.

Importy používané Razor

Následující importy jsou generovány webovými šablonami ASP.NET Core pro podporu Razor souborů:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.AspNetCore.Mvc.ViewFeatures;

Další materiály

Úvod do ASP.NET webového programování pomocí Razor syntaxe poskytuje mnoho ukázek programování pomocí Razor syntaxe.