Движок представлений Razor

Последнее обновление: 22.03.2022

Представления в ASP.NET Core MVC может содержать не только стандартный код html, но и также вставки кода на языке C#. Для обработки кода, который содержит как элементы html, так и конструкции языка C#, применяется движок представлений.

В действительности при вызове метода View контроллер не производит рендеринг представления и не генерирует разметку html. Контроллер только готовит данные и выбирает, какое представление надо возвратить в качестве объекта ViewResult. Затем уже объект ViewResult обращается к движку представления для рендеринга представления в выходной ответ.

По умолчанию в ASP.NET Core MVC применяется один движок представлений - Razor. Хотя при желании мы можем также использовать какие-то другие сторонние движки или создать свой движок представлений самостоятельно. Цель движка представлений Razor - определить переход от разметки html к коду C#.

Синтаксис Razor довольно прост - все его конструкции предваряются символом @, после которого происходит переход к коду C#. Например, определим следующее представление:

<!DOCTYPE html>
<html>
<head>
    <title>METANIT.COM</title>
    <meta charset="utf-8" />
</head>
<body>
    <h2>Time: @DateTime.Now.ToShortTimeString()</h2>
</body>
</html>

Здесь вместо выражения @DateTime.Now.ToShortTimeString() при рендеринге представления будет вставляться текущее время:

движок представлений razor в представлении ASP.NET Core MVC на C#

Типы конструкций Razor

Все конструкции Razor можно условно разделить на два вида: однострочные выражения и блоки кода.

Пример применения однострочных выражений:

<p>Date: @DateTime.Now.ToLongDateString()</p>

В данном случае используется объект DateTime и его метод ToLongDateString()

Или еще один пример:

<p>@(20 + 30)</p>

Так как перед скобками стоит знак @, то выражение в скобках будет интерпретироваться как выражение на языке C#. Поэтому браузер выведет число 50, а не "20 + 30".

Но если вдруг мы создаем код html, в котором присутствует символ @ не как часть синтаксиса Razor, а сам по себе, то, чтобы его отобразить, нам надо его дублировать:

<p>@@DateTime.Now =@DateTime.Now.ToLongDateString()</p>

Блоки кода могут иметь несколько выражений. Блок кода заключается в фигурные скобки, а каждое выражение завершается точкой с запятой аналогично блокам кода и выражениям на C#:

@{
    string head = "Hello METANIT.COM!"; // определяем переменную head
    string text = "ASP.NET Core Application";   // определяем переменную text
}
<!DOCTYPE html>
<html>
<head>
    <title>METANIT.COM</title>
    <meta charset="utf-8" />
</head>
<body>
    <h2>@head</h2> <!-- используем переменную head -->
    <div>@text</div> <!-- используем переменную text -->
</body>
</html>

В блоках кода мы можем определить обычные переменные и потом их использовать в представлении.

определение переменных в коде razor в представлении ASP.NET Core MVC на C#

Если необходимо вывести значение переменной без каких-либо html-элементов, то мы можем использовать специальный снипет <text>:

@{
    int i = 8;
    <text>@i</text>
}
<text>@(i+1)</text>

В Razor могут использоваться комментарии. Они располагаются между символами @**@:

@* текст комментария *@

Условные конструкции

Также мы можем использовать условные конструкции:

@{
    string morning = "Good Morning";
    string evening = "Good Evening";
    string hello = "Hello";
    int hour = DateTime.Now.Hour;
}
@if (hour < 12)
{
    <h2>@morning</h2>
}
else if (hour > 17)
{
    <h2>@evening</h2>
}
else
{
    <h2>@hello</h2>
}

Конструкция switch:

@{
    string language = "german";
}
@switch(language)
{
    case "russian":
        <h3>Привет мир!</h3>
        break;
    case "german":
        <h3>Hallo Welt!</h3>
        break;
    default:
        <h3>Hello World!</h3>
        break;
}

Циклы

Кроме того, мы можем использовать все возможные циклы. Цикл for:

@{
    string[] people = { "Tom", "Sam", "Bob" };
}
<ul>
    @for (var i = 0; i < people.Length; i++)
    {
        <li>@people[i]</li>
    }
</ul>
Циклы в Razor в представлениях в ASP.NET Core MVC на C#

Цикл foreach:

@{
    string[] people = { "Tom", "Sam", "Bob" };
}
<ul>
    @foreach (var person in people)
    {
        <li>@person</li>
    }
</ul>

Цикл while:

@{
    string[] people = { "Tom", "Sam", "Bob" };
    var i = 0;
}
<ul>
    @while ( i < people.Length)
    {
        <li>@people[i++]</li>
    }
</ul>

Цикл do..while:

@{
    var i = 0;
}
<ul>
    @do
    {
        <li>@(i * i)</li>
    }
    while ( i++ < 5);
</ul>

try...catch

Конструкция try...catch...finally, как и в C#, позволяет обработать исключение, которое может возникнуть при выполнение кода:

@try
{
    throw new InvalidOperationException("Something wrong");
}
catch (Exception ex)
{
    <p>Exception: @ex.Message</p>
}
finally
{
    <p>finally</p>
}

Если в блоке try выбрасывается исключение, то выполняется блок catch. И в любом случае в конце блока try и catch выполняется блок finaly.

Вывод текста в блоке кода

Обычный текст в блоке кода мы не сможем вывести:

@{
    bool isEnabled = true;
}
@if (isEnabled)
{
    Hello World
}

В этом случае Razor будет рассматривать строку "Hello" как набор операторов языка C#, которых, естественно в C# нет, поэтому мы получим ошибку. И чтобы вывести текст как есть в блоке кода, нам надо использовать выражение @::

@{
    bool isEnabled = true;
}
@if (isEnabled)
{
    @: Hello
}

Функции

Директива @functions позволяет определить функции, которые могут применяться в представлении. Например:

@functions
{
    public int Sum(int a, int b) 
    {
        return a + b;
    }
    public int Square(int n) => n * n;
}
<p>Sum of 5 and 4: <b> @Sum(5, 4)</b></p>
<p>Square of 4: <b>@Square(4)</b></p>
функции в коде razor в представлении ASP.NET Core MVC на C#

НазадСодержаниеВперед

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850