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á z revizí, jazyka Razor 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 z Razor revizí se nijak neliší od vykreslování HTML ze souboru HTML. Kód HTML v .cshtml
Razor 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 vyhrazené klíčové slovo, přejde na Razorznačky specifické pro konkrétní značky. 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 SVG foreignObject :
@{
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í kódem @
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ý konec, můžou být mezery prolínané:
<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 zabalena do explicitního Razor výrazu Razor 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>
Explicitní výrazy lze použít ke zřetězení textu s výsledkem výrazu:
@{
var joe = new Person("Joe", 33);
}
<p>Age@(joe.Age)</p>
Bez explicitního výrazu <p>Age@joe.Age</p>
se považuje za e-mailovou adresu a <p>Age@joe.Age</p>
vykreslí se. Při zápisu jako explicitního výrazu <p>Age33</p>
se 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í, IHtmlContent
se před vykreslením ToString
převedou na řetězec a zakódují se.
@("<span>Hello World</span>")
Předchozí kód vykreslí následující kód HTML:
<span>Hello World</span>
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.
Upozorňující
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á. Nepoužívejte s HtmlHelper.Raw
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
Razorbloky 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 s kódem, které budou 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 kódu HTML nebo Razor značky dojde k Razor chybě za běhu.
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 rest celý řádek 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 null
hodnota předaná nebo false
, atribut se nevykreslí.
Představte si například následující razor:
<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 kód, 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),
...
};
}
Podporují se 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. Stejný Razormechanismus se používá k vytvoření pomocných rutin HTML, které obsahují další obsah. V následujícím kódu vykreslují <form>
pomocné rutiny HTML značku pomocí @using
příkazu:
@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 před vykreslením webové stránky se serverem odeberou komentáře. Razor používá @* *@
k oddělovači komentářů. Následující kód je zakomentován, takže server nevykresluje žádné revize:
@*
@{
/* 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.CounterRoute
která 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 alias @functions
a doporučuje se v průběhu @functions
@code
. 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)
}
V Razor komponentách můžete přidávat @code
@functions
členy jazyka C#.
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 metody šablon, 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 Dispose metoda může být volána:
@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 vlastní 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.";
}
Zobrazí CustomText
se v zobrazení:
@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 ho použít ve stejném zobrazení. @inherits
může být v _ViewImports.cshtml
souboru, který zobrazení importuje:
@inherits CustomRazorPage<TModel>
Následující kód je příkladem zobrazení silného typu:
@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 @inject
Razor 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 rozložení jádraBlazor.
@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>
RazorModel
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
vygenerovanou RazorPage<T>
třídu, ze které je zobrazení odvozeno. Pokud není zadána @model
direktiva Model
, vlastnost je typu dynamic
. Další informace najdete na webu Strongly typed models and the @model keyword.
@namespace
Direktiva @namespace
:
- Nastaví obor názvů třídy vygenerované Razor stránky, zobrazení MVC nebo Razor komponenty.
- Nastaví kořenové odvozené obory názvů stránek, zobrazení nebo komponent třídy z nejbližšího importového souboru ve stromu adresáře (
_ViewImports.cshtml
zobrazení nebo stránky) nebo_Imports.razor
(Razor komponenty).
@namespace Your.Namespace.Here
Razor Příklad Stránky 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 oboru názvů.
Page | Obor názvů |
---|---|
Pages/Index.cshtml |
Hello.World |
Pages/MorePages/Page.cshtml |
Hello.World.MorePages |
Pages/MorePages/EvenMorePages/Page.cshtml |
Hello.World.MorePages.EvenMorePages |
Předchozí relace 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.
Page | 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:
.cshtml
V souboru označuje, že je soubor stránkouRazor. Další informace naleznete v tématu Vlastní trasy a Úvod do Razor stránek v ASP.NET Core.- Určuje, že komponenta Razor by měla zpracovávat požadavky přímo. Další informace najdete v tématu ASP.NET Blazor Základní směrování a navigace.
@preservewhitespace
Tento scénář platí jenom pro Razor komponenty (.razor
).
Pokud je tato možnost nastavená na false
(výchozí), odebere se prázdné znaky vykreslené značky ze Razor součástí (.razor
), pokud:
- Na začátku nebo na konci elementu
- Počáteční nebo koncové hodnoty v rámci parametru
RenderFragment
Například podřízený 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 ServerInteractiveWebAssembly
: 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í s atributem direktivy/direktivy, najdete v tématu ASP.NET režimy vykreslování CoreBlazor.
@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 MVC a Razor 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:
- podpora obecného typu komponenty ASP.NET Core Razor
- Komponenty ASP.NET Core Blazor bez vizuálního vzhledu
@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 také řídí, @using
které komponenty jsou v oboru.
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 ASP.NET splatting atributu Core Blazor a libovolné parametry.
@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 Základní Blazor datová vazba.
@bind:culture
Tento scénář platí jenom pro Razor komponenty (.razor
).
@bind:culture
Atribut s atributem @bind
slouží k analýze System.Globalization.CultureInfo a formátování hodnoty. Další informace najdete v tématu ASP.NET globalizace a lokalizace jádraBlazor.
@formname
Tento scénář platí jenom pro Razor komponenty (.razor
).
@formname
přiřadí název Razor formuláře k prostému html formuláři nebo formuláři komponenty na EditForm základě (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 CoreBlazor.
@on{EVENT}
Tento scénář platí jenom pro Razor komponenty (.razor
).
Razor poskytuje funkce zpracování událostí pro komponenty. Další informace najdete v tématu ASP.NET Zpracování událostí CoreBlazor.
@on{EVENT}:preventDefault
Tento scénář platí jenom pro Razor komponenty (.razor
).
Zabrání výchozí akci události.
@on{EVENT}:stopPropagation
Tento scénář platí jenom pro Razor komponenty (.razor
).
Zastaví šíření události pro událost.
@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 šablony Razor delegáta jako Func<T,TResult>. Dynamický typ je určen pro parametr metody, který delegát zapouzdřuje. Typ objektu je určen jako návratová hodnota delegáta. Šablona se používá s vlastností List<T> , která Pet
má Name
vlastnost.
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 je Repeat
volána metoda s:
- List<T> z
Pet
. - Počet opakování každého domácího mazlíčka
- Vložená šablona, která se má použít pro položky seznamu 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é rutiny značek
Tento scénář platí jenom pro zobrazení MVC a Razor stránky (.cshtml
).
Existují tři direktivy, které se týkají pomocných rutin značek.
Direktiva | Function |
---|---|
@addTagHelper |
Zpřístupní pomocné rutiny značek pro zobrazení. |
@removeTagHelper |
Odebere pomocné rutiny značek dříve přidané ze zobrazení. |
@tagHelperPrefix |
Určuje předponu značky, která povolí podporu pomocné rutiny značek a aby byla explicitní použití pomocné rutiny značek. |
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í @
uteče parser.Razor @
Druhý unikne analyzátoru jazyka C#.
Vyhrazená klíčová slova, která nepoužívají Razor
class
Kontrola třídy jazyka Razor C# vygenerované pro zobrazení
Sada Razor SDK zpracovává kompilaci Razor souborů. Ve výchozím nastavení se vygenerované soubory kódu nevygenerují. 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 6.0 (net6.0
) v Debug
konfiguraci Razor sestavení sada SDK vygeneruje obj/Debug/net6.0/generated/
adresář 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ů. Při sestavování projektu Razor sada SDK vygeneruje obj/{BUILD CONFIGURATION}/{TARGET FRAMEWORK MONIKER}/Razor
adresář v kořenovém adresáři 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í. - V systémech souborů s rozlišováním malých a velkých písmen (například Linux, OSX a with
EmbeddedFileProvider
) se rozlišují malá a velká písmena. Například konkrétněreturn View("Test")
odpovídá/Views/Home/Test.cshtml
.
- 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
- Předkompilovaná zobrazení: Při použití ASP.NET Core 2.0 a novějších zobrazení se při vyhledávání předkompilovaných zobrazení nerozlišují velká a malá písmena ve 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 odpovídali velikostí písmen názvů souborů a adresářů a velikostí písmen:
- 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.