<tbody>
@foreach (var item in Model)
{
<tr>
@if (showMake)
{
<td>
@Html.DisplayFor(modelItem => item.MakeNavigation.Name)
</td>
}
<td>
@Html.DisplayFor(modelItem => item.Color)
</td>
<td>
@Html.DisplayFor(modelItem => item.PetName)
</td>
<td>
<item-edit item-id="@item.Id"></item-edit> |
<item-details item-id="@item.Id"></item-details> |
<item-delete item-id="@item.Id"></item-delete>
</td>
</tr>
}
</tbody>
</table>
Представление Index
При наличии частичного представления _CarListPartial представление Index будет небольшим. Создайте в каталоге ViewsCars новый файл представления по имени Index.cshtml. Удалите весь сгенерированный код и добавьте следующую разметку:
@model IEnumerable<Car>
@{
ViewData["Title"] = "Index";
}
<h1>Vehicle Inventory</h1>
<partial name="Partials/_CarListPartial" model="@Model"/>
Частичное представление _CarListPartial вызывается со значением модели содержащего представления (IEnumerable<Car>), которое передается с помощью атрибута model. В итоге модель частичного представления устанавливается в объект, переданный вспомогательной функции дескриптора <partial>.
Чтобы взглянуть на представление Index, модифицируйте метод Index() класса CarsController, как показано ниже:
[Route("/[controller]")]
[Route("/[controller]/[action]")]
(window.adrunTag = window.adrunTag || []).push({v: 1, el: 'adrun-4-390', c: 4, b: 390})
public IActionResult Index()
=> View(_repo.GetAllIgnoreQueryFilters());
Запустив приложение и перейдя по ссылке https://localhost:5001/Cars/Index, вы увидите список автомобилей (рис. 31.4).
![]()
В правой части списка отображаются специальные вспомогательные функции дескрипторов.
Представление ВуMake
Представление ВуMake похоже на Index, но настраивает частичное представление так, что информация о производителе отображается только в заголовке страницы. Создайте в каталоге ViewsCars новый файл представления по имени ВуMake.cshtml. Удалите весь сгенерированный код и добавьте следующую разметку:
@model IEnumerable<Car>
@{
ViewData["Title"] = "Index";
}
<h1>Vehicle Inventory for @ViewBag.MakeName</h1>
@{
var mode = new ViewDataDictionary(ViewData) {{"ByMake", true}};
}
<partial name="Partials/_CarListPartial" model="Model" view-data="@mode"/>
Отличия заметить легко. Здесь создается экземпляр ViewDataDictionary, содержащий свойство ByMake из ViewBag, который затем вместе с моделью передается частичному представлению, что позволяет скрыть информацию о производителе. Метод действия для этого представления должен получить все автомобили с указанным значением MakeId и установить ViewBag в MakeName с целью отображения в пользовательском интерфейсе. Оба значения берутся из маршрута. Добавьте в класс CarsController новый метод действия по имени ByMake():
[HttpGet("/[controller]/[action]/{makeId}/{makeName}")]
public IActionResult ByMake(int makeId, string makeName)
{
ViewBag.MakeName = makeName;
return View(_repo.GetAllBy(makeId));
}
Запустив приложение и перейдя по ссылке https://localhost:5001/Cars/l/VW, вы увидите список, показанный на рис. 31.5.
![]()
Представление Details
Создайте в каталоге ViewsCars новый файл представления по имени Details.cshtml. Удалите весь сгенерированный код и добавьте следующую разметку:
