Тренинг ASP.NET MVC 3 Гайдар Магдануров Microsoft Модуль 2 ДВИЖОК ПРЕДСТАВЛЕНИЯ RAZOR Содержание модуля Синтаксис Razor Сравнение с WebForms и PHP Варианты вставок кода в разметку Шаблоны страниц Повторное использование кода разметки Razor Syntax <div> @if (User.IsAdmin()) { <a href=“/Edit”>Edit</a> } </div> • Простое смешивание C# кода и HTML разметки • Совместимость с ASP.NET Web Pages и WebMatrix Сравним Razor… Web Forms (6 вставок): PHP (2 вставки и echo): Razor (2 вставки): <ul> <% for (int i = 0; i < 10; i++) { %> <li><% =i %></li> <% } %> </ul> <ul> <?php for ($i = 0; $i < 10; $i++) { echo("<li>$i</li>"); } ?> </ul> <ul> @for (int i = 0; i < 10; i++) { <li>@i</li> } </ul> Включение кода в разметку @{ var name = “John Doe”; <div> Your name: @name </div> Вариант 1: HTML -блок } @{ var name = “John Doe”; <text> Your name: @name </text> Вариант 2: Текстовое поле } Вариант 3: Строка текста @{ var name = “John Doe”; @: Your name: @name } Циклы for @for (int i = 0; i < 10; i++) { <li>@i</li> } foreach @foreach (var p in Model){ <li>@p.LastName, @p.Name</li> } Комментарии Вариант 1: Разметка Вариант 2: Код Вариант 3: Код и разметка @* <div> Hello World </div> *@ @{ //var name = "John Doe”; //@name } @* @{ var name = "John Doe"; @name } *@ Шаблоны страниц Нет нужды повторяться Общий шаблон для всех страниц Page 1 Page 2 Layout.cshtml Page 3 Синтаксис щаблонов 1. Определить шаблон (Layout) 2. Ссылаться на него на страницах /Shared/_Layout.cshtml <html> <head> MyPage.cshtml <title>Simple Layout</title> </head> @{ <body> Layout = "/Shared/_Layout.cshtml"; @RenderBody() } </body> </html> <p> My content goes here </p> Секции шаблонов Секции позволяют странице занимать несколько блоков в шаблоне /Shared/_Layout.cshtml MyPage.cshtml <html> <head> @{ <title>Simple Layout</title> Layout = "/Shared/_Layout.cshtml"; </head> } <body> @RenderSection("Menu") @section Menu { @RenderBody() <ul id="pageMenu"> </body> <li>Option 1</li> </html> <li>Option 2</li> </ul> } <p> My content goes here </p> Повторное использование разметки Метод RenderPage() позволяет включать другие страницы /Shared/_Layout.cshtml /Shared/_Footer.cshtml <html> <div class="footer"> <head> © 2010 Contoso <title>Simple Layout</title> </div> </head> <body> @RenderSection("Menu") @RenderBody() @RenderPage("/Shared/_Footer.cshtml") </body> </html> Демонстрация RAZOR СПАСИБО ЗА ВНИМАНИЕ! Смотрите в следующей серии… Работа с данными и модели…