ASP_NET_MVC_4_Framework_s_primerami_na_C_dlya_p
.pdf
Сразу после создания оно будет пустым, и мы добавим в него содержимое, показанное в листинге
18-23.
Листинг 18-23: Файл MyPartial.cshtml
<div>
This is the message from the partial view. @Html.ActionLink("This is a link to the Index action", "Index")
</div>
Мы хотим продемонстрировать, как можно смешивать HTML-разметку и теги Razor, поэтому мы определили в нем простое сообщение и вызов к вспомогательному методу ActionLink.
Чтобы использовать частичное представление, нужно вызвать вспомогательный метод HTML Partial из другого представления. Для демонстрации мы внесли изменения в файл
~/Views/Common/List.cshtml, как показано в листинге 18-24.
Листинг 18-24: Используем частичное представление
@{
ViewBag.Title = "List";
Layout = null;
}
<h3>This is the /Views/Common/List.cshtml View</h3>
@Html.Partial("MyPartial")
Имя файла представления указывается без расширения. Движок представлений будет искать указанное частичное представление по обычным адресам поиска, то есть при визуализации представления для контроллера Home - в папках /Views/Home и /Views/Shared. (Мы установили переменной Layout значение null, так что теперь нам не нужно указывать секции, которые использовались ранее в этой главе.)
Подсказка
Движок представлений Razor ищет частичные представления так же, как и обычные (в папках ~/Views/<controller> и ~/Views/Shared). Это значит, что
можно создавать специализированные версии частичных представлений для конкретных контроллеров и переопределять частичные представления с одинаковыми именами в папке Shared. Хотя последняя функция может показаться
странной, она очень удобна, потому что чаще всего частичные представления используются для визуализации контента в макете.
Вы можете увидеть вывод частичного представления, запустив приложение и перейдя по ссылке /Home/List, как показано на рисунке 18-9.
471
Рисунок 18-9: Вывод частичного представления
Подсказка
С помощью вызова вспомогательного метода ActionLink в частичном представлении мы получаем из обрабатываемого запроса информацию о контроллере. Это значит, что если мы указываем метод Index, элемент a будет относиться к контроллеру Home, так как именно этот контроллер вызывает визуализацию частичного представления. Если мы используем частичные представления в представлении, которое визуализируется другим контроллером, то ActionLink сгенерирует ссылку на этот контроллер. Мы вернемся к вспомогательным методам HTML в главе 19.
Используем строго типизированные частичные представления
Можно также создать строго типизированное частичное представление, а затем передавать в него объекты моделей представлений, которые оно будет визуализировать. Чтобы это продемонстрировать, мы создали новое строго типизированное частичное представление под названием MyStronglyTypedPartial.cshtml в папке /Views/Shared. Оно создается практически так же, как и обычное частичное представление, только нужно выбрать или ввести с клавиатуры тип для опции Model class, как показано на рисунке 18-10. Мы использовали тип IEnumerable<string>.
Рисунок 18-10: Создаем строго типизированное частичное представление
472
В листинге 18-25 показаны дополнения в файле частичного представления, который был создан Visual Studio. Изначально он содержит только тег модели @, который указывает тип модели представления.
Листинг 18-25: Создаем строго типизированное частичное представление
@model IEnumerable<string>
<div>
This is the message from the partial view. <ul>
@foreach (string str in Model)
{
<li>@str</li>
}
</ul>
</div>
Мы отображаем содержимое объекта модели представления как список HTML с помощью тега Razor @foreach. Чтобы продемонстрировать работу этого частичного представления, мы обновили файл
/Views/Common/List.cshtml, как показано в листинге 18-26.
Листинг 18-26: Используем строго типизированное частичное представление
@{
ViewBag.Title = "List"; Layout = null;
}
<h3>This is the /Views/Common/List.cshtml View</h3>
@Html.Partial("MyStronglyTypedPartial", new[] { "Apple", "Orange", "Pear" })
Отличие от предыдущего примера заключается в том, что здесь мы передаем дополнительный аргумент во вспомогательный метод Partial, который определяет объект модели представления. Чтобы увидеть, как работает это строго типизированное частичное представление, запустите приложение и перейдите по ссылке /Home/List, как показано на рисунке 18-11.
Рисунок 18-11: Используем строго типизированное частичное представление
473
Используем дочерние действия
Дочерние действия – это методы действий, которые вызываются из представления. Они позволяют избежать дублирования логики контроллера, которую необходимо использовать в приложении несколько раз. Дочерние действия так же относятся к действиям, как частичные представления – к представлениям.
Дочерние действия чаще всего используются для отображения какого-либо управляемого данными виджета, который должен появляться на нескольких страницах и содержит данные, не относящиеся к основному действию. Мы их использовали в примере приложения SportsStore, когда необходимо было во все страницы включить управляемое данными меню навигации, без необходимости поставлять данные о категориях навигации непосредственно от каждого действия метода. Эти данные поставлялись независимо дочерним действием.
Создаем дочернее действие
Любое действие можно использовать как дочернее. Чтобы продемонстрировать работу дочерних действий, мы добавили новый метод действия в контроллер Home, как показано в листинге 18-27.
Листинг 18-27: Добавляем дочернее действие в контроллер Home
using System.Web.Mvc; using System;
namespace WorkingWithRazor.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
string[] names = {"Apple", "Orange", "Pear"}; return View(names);
}
public ActionResult List()
{
return View();
}
[ChildActionOnly]
public ActionResult Time()
{
return PartialView(DateTime.Now);
}
}
}
Наш метод действия называется Time и визуализирует частичное представление, вызывая метод PartialView (о котором мы рассказывали в главе 15). Атрибут ChildActionOnly гарантирует, что метод действия может быть вызван только как дочернее действие из представления. Хотя метод действия может использоваться как дочерний и без этого атрибута, мы всегда применяем ChildActionOnly, чтобы данный метод невозможно было вызвать на запрос пользователя.
После определения метода действия нам нужно создать частичное представление, которое он будет визуализировать. Дочерние действия обычно связываются с частичными представлениями, хотя это и необязательно. В листинге 18-28 показано представление /Views/Home/Time.cshtml, которое мы создали для работы с нашим дочерним действием. Это строго типизированное частичное представление, моделью которого является объект DateTime.
474
Листинг 18-28: Частичное представление для дочернего действия
@model DateTime
<p>The time is: @Model.ToShortTimeString()</p>
Визуализируем дочернее действие
Дочернее действие вызывается вспомогательным методом Html.Action. После данного вызова выполняется метод действия, обрабатывается ViewResult, и вывод внедряется в ответ клиенту. В листинге 18-29 показаны изменения, которые мы внесли в файл /Views/Common/List.cshtml, чтобы визуализировать дочернее действие.
Листинг 18-29: Вызов дочернего действия из представления List
@{
ViewBag.Title = "List"; Layout = null;
}
<h3>This is the /Views/Common/List.cshtml View</h3>
@Html.Partial("MyStronglyTypedPartial", new[] { "Apple", "Orange", "Pear" })
@Html.Action("Time")
Вы можете увидеть вывод дочернего действия, запустив приложение и снова перейдя по ссылке /Home/List, как показано на рисунке 18-12.
Рисунок 18-12: Используем дочернее действие
Вспомогательному методу Action, который был вызван в листинге 18-29, мы передали параметр с именем вызываемого метода действия. MVC Framework будет искать метод действия в контроллере,
475
который обрабатывает текущий запрос. Чтобы вызвать метод действия из другого контроллера, передайте в параметр его имя, например:
@Html.Action("Time", "MyController")
В методы действий можно передавать параметры с помощью анонимно типизированных объектов, свойства которых соответствуют именам параметров дочернего метода действия. Так, например, следующее дочернее действие:
[ChildActionOnly]
public ActionResult Time(DateTime time)
{
return PartialView(time);
}
можно вызвать из представления следующим образом:
@Html.Action("Time", new { time = DateTime.Now })
Резюме
В этой главе мы исследовали систему представлений MVC и движок представлений Razor. Вы научились создавать собственные движки представлений, настраивать поведение стандартного движка Razor и познакомились со всеми доступными техниками добавления динамического контента в представление. Следующая глава будет посвящена вспомогательным методам, с помощью которых можно генерировать контент для использования в представлениях.
476
Вспомогательные методы
В этой главе мы рассмотрим вспомогательные методы, которые содержат фрагменты кода и разметки для повторного использования в приложении MVC. Для начала мы научимся создавать собственные вспомогательные методы. Также в этой и следующих главах мы изучим многочисленные встроенные вспомогательные методы, начиная с методов для создания элементов
HTML form, input и select.
Создание проекта для примера
Для этой главы мы создали новый проект Visual Studio под названием HelperMethods, используя шаблон Basic. В него был добавлен контроллер Home, который показан в листинге 19-1.
Листинг 19-1: Контроллер Home в проекте HelperMethods
using System.Web.Mvc;
namespace HelperMethods.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.Fruits = new string[] {"Apple", "Orange", "Pear"}; ViewBag.Cities = new string[] {"New York", "London", "Paris"};
string message = "This is an HTML element: <input>";
return View((object) message);
}
}
}
Мы передаем в представление пару строковых массивов через ViewBag и устанавливаем string в качестве объекта модели. Мы создали в папке /Views/Home файл представления Index.cshtml, содержимое которого вы можете увидеть в листинге 19-2. Это строго типизированное представление (типом модели является string), для которого не используется макет.
Листинг 19-2: Содержимое файла Index.cshtml
@model string @{
Layout = null;
}
<!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" /> <title>Index</title>
</head>
<body>
<div>
Here are the fruits:
@foreach (string str in (string[])ViewBag.Fruits)
{
<b>@str </b>
}
</div>
<div>
477
Here are the cities:
@foreach (string str in (string[])ViewBag.Cities)
{
<b>@str </b>
}
</div>
<div>
Here is the message: <p>@Model</p>
</div>
</body>
</html>
Чтобы увидеть, как визуализируется представление, запустите приложение. В соответствии со стандартной конфигурацией маршрутизации, которую добавляет в проект Visual Studio, корневой URL, автоматически запрошенный браузером, будет соотнесен с действием Index контроллера Home, как показано на рисунке 19-1.
Рисунок 19-1: Запускаем приложение
Создание пользовательских вспомогательных методов
Следуя плану, установившемуся в последних нескольких главах, мы начнем изучение вспомогательных методов с создания собственной реализации. В следующих разделах мы продемонстрируем две техники для создания пользовательских вспомогательных методов.
Создаем внутренний вспомогательный метод
Самый простой вид вспомогательных методов - внутренние (inline) вспомогательные методы, которые определяются внутри представления. Чтобы упростить наш пример представления, мы можем создать внутренний вспомогательный метод с помощью тега @helper, как показано в листинге 19-3.
Листинг 19-3: Создаем внутренний вспомогательный метод
@model string
@{
478
Layout = null;
}
@helper ListArrayItems(string[] items)
{
foreach (string str in items)
{
<b>@str </b>
}
}
<!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" /> <title>Index</title>
</head>
<body>
<div>
Here are the fruits: @ListArrayItems(ViewBag.Fruits)
</div>
<div>
Here are the cities: @ListArrayItems(ViewBag.Cities)
</div>
<div>
Here is the message: <p>@Model</p>
</div>
</body>
</html>
Внутренние вспомогательные методы имеют такие же имена и параметры, как и обычные методы C#. В данном примере мы определили вспомогательный метод под названием ListArrayItems, который принимает в качестве параметра строковый массив. Хотя внутренний вспомогательный метод выглядит как метод, он не возвращает никакого значения. Его содержание обрабатывается и помещается в ответ клиенту.
Подсказка
Обратите внимание, что при использовании внутренних вспомогательных методов не нужно приводить тип динамических свойств из ViewBag к строковым массивам.
Одной из особенностей этого вида вспомогательных методов является то, что он может приводить типы во время выполнения.
Тело внутреннего вспомогательного метод имеет такой же синтаксис, как и все остальное представление Razor. Строки литералов рассматриваются как статический HTML, а операторы, которые требуют обработки Razor, отмечаются префиксом @. Вспомогательный метод в примере смешивает статический HTML и теги Razor для перечисления элементов в массиве и дает тот же результат, что и наше первоначальное представление, сокращая дублирование кода и разметки.
Преимущество этого подхода заключается в том, что для изменения способа отображения содержимого массива нам нужно сделать только одно изменение. Например, в листинге 19-4 показано, как мы заменили обычную запись значений из массива на запись в виде ненумерованного списка HTML.
Листинг 19-4: Изменяем содержимое вспомогательного метода
@helper ListArrayItems(string[] items)
{
479
<ul>
@foreach (string str in items)
{
<li>@str</li>
}
</ul>
}
Нужно внести только одно изменение - это может показаться незначительным преимуществом в таком простом примере, но в реальных проектах поможет сохранить представления простыми и последовательными. Результат этого изменения показан на рисунке 19-2.
Подсказка
Обратите внимание, что в этом примере мы отметили префиксом @ ключевое слово foreach, а в листинге 19-3 - нет. Дело в том, что первый элемент в теле
вспомогательного метода изменился на элемент HTML, следовательно, мы должны сообщить Razor с помощью тега @, что мы используем оператор C #. В предыдущем
примере элементов HTML не было, так что Razor рассматривал содержание тела вспомогательного метода как код. Такие мелочи было бы трудно отслеживать, но, к счастью, Visual Studio их подсвечивает.
Рисунок 19-2: Измененяем разметку в вспомогательном методе
Создаем внешние вспомогательные методы
Внутренние вспомогательные методы удобны, но их можно использовать только в том представлении, в котором они были объявлены, и из-за своей сложности или объема могут затруднить его чтение.
В качестве альтернативы можно использовать внешние (external) вспомогательные методы HTML, которые выражаются как методы расширения C#. Внешние вспомогательные методы используются шире, но и создавать их сложнее, потому что C# не очень хорошо обрабатывает элементы HTML.
Чтобы продемонстрировать их работу, мы создали в проекте папку Infrastructure, а в ней - новый класс CustomHelpers.cs. Содержимое этого файла показано в листинге 19-5.
480