Mvc 5, вираження razor

Тепер, коли були показані основи уявлень і компоновок, ми збираємося перейти на інші види виразів, підтримувані Razor, і продемонструвати їх застосування для створення вмісту уявлень. В хорошому додатку MVC Framework є чіткий поділ між ролями методу дії і уявлення. Для цілей цієї статті правила прості; вони коротко описані в таблиці нижче:

Ролі, що виконуються методом дії і поданням

Передає поданням об'єкт моделі представлення

Чи не передає поданням сформатував дані

Використовує об'єкт моделі представлення для відображення вмісту користувачеві

Не змінює жодного аспекту в об'єкті моделі представлення

Щоб витягти максимум з MVC Framework, необхідно забезпечити відділення різних частин програми один від одного. Ви побачите, що механізм Razor дозволяє робити багато чого, включаючи використання операторів C #. Однак ви не повинні застосовувати Razor для виконання бізнес-логіки або маніпулювання об'єктами моделей предметної області.

Крім того, ви не повинні форматувати дані, які метод дії передає поданням. Замість цього дозвольте поданням обчислити дані, які йому необхідно відобразити. Простий приклад цього був приведений в попередній статті. Ми визначили метод дії на ім'я NameAndPrice (), який відображає значення властивостей Name і Price об'єкта Product. Незважаючи на те що відомо, значення яких властивостей повинні відображатися, моделі представлення передається повний об'єкт Product:

Потім всередині уявлення використовується Razor-вираз @Model для отримання значень цікавлять властивостей:

Рядок, призначену для відображення, можна було б створити в методі дії і передати її поданням як об'єкт моделі уявлення. Це б спрацювало, але такий підхід розмиває перевага шаблону MVC і зменшує можливості щодо внесення змін в майбутньому. Як вже було сказано, ми ще повернемося до цієї теми, але ви повинні запам'ятати, що інфраструктура MVC Framework не примушує правильно застосовувати шаблон MVC і потрібно враховувати вплив рішень, прийнятих під час проектування і написання коду.

Важливо відрізняти обробку даних від їх форматування. Уявлення форматують дані, тому в попередньому прикладі поданням передається об'єкт Product, а не властивості цього об'єкта, сформатував в отображаемую рядок. Обробка даних, включаючи вибір об'єктів даних для відображення, є відповідальністю контролера, який буде звертатися до моделі з метою отримання і модифікації необхідних даних. Іноді важко зрозуміти, де проходить межа між обробкою і форматуванням, але в якості емпіричного правила рекомендується зайняти обережну позицію і виносити все крім найпростіших виразів з уявлення в контролер.

Вставка значень даних

Найпростіше, що можна робити за допомогою виразу Razor - вставляти значення даних в розмітку. Це здійснюється з використанням виразу @Model, що дозволяє посилатися на властивості і методи, які визначені об'єктом моделі уявлення, або вираження @ViewBag для посилання на властивості, певні динамічно за допомогою об'єкта ViewBag.

Ви вже бачили приклади обох виразів, але для повноти ми додали в контролер Home новий метод дії на ім'я DemoExpressions, який передає дані поданням із застосуванням об'єкта моделі і об'єкта ViewBag. Визначення цього нового методу дії наведено в прикладі нижче:

Для демонстрації цих базових типів виразів ми створили строго типізовані уявлення у файлі на ім'я DemoExpression.cshtml, розташованому в папці Views / Home, вміст якого показано в прикладі нижче:

У цьому прикладі створюється проста HTML-таблиця, осередки якої заповнюються властивостями з об'єкта моделі і об'єкта ViewBag. На малюнку нижче показаний результат запуску додатка і переходу по URL виду / Home / DemoExpression. Він лише підтверджує роботу базових виразів Razor, які застосовувалися в прикладах до сих пір.

Mvc 5, вираження razor

Результат не можна назвати вражаючим, оскільки ніякі CSS-стилі до HTML-елементів, що згенерував поданням і компонуванням, не застосовувалися, проте цей приклад призначений тільки для ілюстрації способу використання базових виразів Razor для відображення даних, що передаються з методу дії на виставу.

Установка значень атрибутів

У всіх розглянутих досі прикладах встановлювалося вміст елементів, але вираження Razor можна також застосовувати і для установки значень атрибутів елемента. У прикладі нижче показано змінене уявлення DemoExpression, в якому властивості об'єкта ViewBag використовуються як значення атрибутів:

Вирази Razor використовуються для установки значень деяких атрибутів даних в елементі div.

Атрибути даних, імена яких починаються з data-, протягом багатьох років були неформальним способом створення спеціальних атрибутів, а тепер вони зроблені частиною формального стандарту HTML5. Для установки значень цих атрибутів застосовуються властивості ApplyDiscount, ExpressShip і Supplier об'єкта ViewBag.

Значення False і True відповідають булевих значень властивостей в об'єкті ViewBag, але механізм Razor зробив дещо зручне для властивості зі значенням null, візуалізувати для нього порожній рядок.

Друга частина розмітки, доданої до подання, більш цікава. У ній визначено набір прапорців, атрибути checked яких встановлюються в ті ж самі властивості об'єкта ViewBag, що і атрибути даних. Згенерована Razor розмітка HTML виглядає наступним чином:

Механізм візуалізації Razor обізнаний про принцип використання таких атрибутів, як checked, коли конфігурацію елемента змінює присутність самого атрибута, а не його значення (в специфікації HTML це називається Булевського атрибутами). Якби механізм Razor вставив False, null або порожній рядок як значення атрибуту checked, то відображається браузером прапорець виявився б зазначеним. Замість цього в разі значення false або null механізм Razor повністю видаляє атрибут з елемента, забезпечуючи узгоджений з даними уявлення результат:

Mvc 5, вираження razor

Використання умовних операторів

Механізм Razor здатний обробляти умовні оператори, а це означає можливість налаштування виводу з уявлення на основі значень даних уявлення. Такий прийом є найбільш важливою частиною Razor і дозволяє створювати складні і мінливі компонування, які як і раніше залишаються простими в розумінні і супроводі. У прикладі нижче наведено оновлений вміст файлу уявлення DemoExpreseion.cshtml, що включає умовний оператор:

Щоб почати умовний оператор, перед умовним ключовим словом C # (в цьому прикладі switch) поміщається символ @. Блок коду завершується закриває фігурної дужки ">", як і в разі звичайного блоку коду C #.

Зверніть увагу, що для використання всередині оператора switch значення властивості ViewBag.ProductCount має бути приведене до типу int. Причина в тому, що Razor-вираз switch не може оцінювати динамічна властивість - потрібно приведення до специфічного типу, щоб було відомо, як виконувати порівняння.

Усередині блоку коду Razor в висновок уявлення можна включати HTML-елементи і значення даних, просто визначаючи HTML-розмітку і вирази Razor, наприклад:

Поміщати елементи або виразу в лапки або відзначати їх якимось спеціальним чином не потрібно - механізм Razor буде інтерпретувати це як висновок, який повинен бути оброблений. Проте, якщо потрібно вставити в уявлення літеральний текст, коли він не міститься в HTML-елементі, про це знадобиться повідомити Razor, додавши до рядка префікс, як показано нижче:

Символи "@:" запобігають обробку механізмом Razor цього рядка як оператора C #, що є стандартним поведінкою щодо тексту. Результат виконання цього умовного оператора можна бачити на малюнку нижче:

Mvc 5, вираження razor

Умовні оператори грають важливу роль в уявленнях Razor, тому що вони дозволяють пристосовувати вміст до значень даних, які уявлення отримує від методу дії. В якості додаткової демонстрації в прикладі нижче наведено уявлення DemoExpression.cshtml з доданим оператором if - ще одним поширеним умовним оператором:

Цей умовний оператор видає ті ж самі результати, що й оператор switch, але ми просто хотіли продемонструвати застосування умовних операторів C # в уявленнях Razor.

Прохід по вмісту масивів і колекцій

При розробці програми MVC часто необхідно виконувати прохід по вмісту масиву або іншого різновиду колекції об'єктів з генерацією докладної інформації для кожного об'єкта. Щоб показати, як це робиться, ми визначили в контролері Home новий метод дії на ім'я DemoArray:

Цей метод дії створює об'єкт Product [], який містить прості значення даних, і передає його методу View для візуалізації з використанням стандартного уявлення. Засіб формування шаблонів Visual Studio не дозволяє вказувати масив в якості типу моделі. (Причина не відома, тому що сам механізм Razor благополучно підтримує масиви.)

Найкращий підхід до створення вистави для методу дії, який передає масив, передбачає створення уявлення без моделі і потім ручне додавання вираження @model після того, як файл згенерований. У прикладі нижче показано вміст файлу DemoArray.cshtml, створеного в папці Views / Home і відповідним чином відредагованого:

В результаті генерується елемент h2, якщо масив порожній, і по одному рядку HTML-таблиці для кожного елемента масиву в іншому випадку. Оскільки в розглянутому прикладі дані є статичними, буде виходити завжди один і той же результат:

Mvc 5, вираження razor

Робота з просторами імен

В останньому прикладі ви напевно помітили, що для посилання на Product в циклі foreach використовується повністю певне ім'я:

Це може стати утомливих в складних уявленнях, що містять багато посилань на модель подання та інші класи, Привести в порядок подання можна за рахунок застосування виразу @using. щоб забезпечити для подання контекст певного простору імен, як це робиться для звичайного класу C #. У прикладі нижче демонструється застосування вираженні @using:

Подання може містити безліч виразів @using. У показаному вище коді вираз @using використовується для імпорту простору імен Razor.Models, що дозволяє не вказувати простір імен в вираженні @model і всередині циклу foreach.

Схожі статті