22 января 2013 г.

Создание Razor-расширений (хэлперов) в представлениях ASP.Net MVC

Мне очень нравится движок представления Razor. Вначале, конечно же, было странно как-то, но теперь уже и не знаю, как можно писать по-другому.

Помимо всех прелестей, Razor позволяет также создавать свои хэлперы в рамках одного представления. Зачем это нужно? Например, чтобы использовать один и тот же кусок разметки несколько раз в одном представлении. Да, для этого можно использовать PartialView. Хэлпер - же является более простым, локальным решением. Главное его преимущество перед PartialView - это быстрота отрисовки, недостаток - конкретный хэлпер виден только в рамках текущего представления.

Итак, сегодня мы научимся создавать Razor-расширения внутри представлений, и также посмотрим, как и где это можно применять.
Вернемся к назначению хэлперов. Самый простой пример использования расширений в представлении - задача, когда нужно продублировать постраничную навигацию, сделать ее доступной в начале страницы, и в ее конце. В таком случае нам нужно лишь продублировать кусок разметки в другом месте, без частичных представлений и прочих сложностей.

Пожалуй, самое главное, что нужно запомнить из этой статьи - это то, что написание расширения в представлении начинается с ключевого слова @helper:

   1:  @helper Pagination()
   2:  {
   3:      <div class="pagingDiv">
   4:          <a href="#"><-- Назад</a>   <a href="#">Вперед --></a>
   5:      </div>
   6:  }

Вот наше расширение для пейджинга. Pagination - название, по которому мы сможем вставлять это расширении в любое место представления, и столько раз, сколько потребуется:

@Pagination()
<!-- много много строчек текста -->
@Pagination()

Кроме этого, в хэлпер можно передавать любые параметры. Более того, на основе этих параметров (ну и без них тоже), в хэлпере можно проводить кое-какие вычисления, или использовать какую-то логику.

Пример:

   1:  @helper HeaderHelper(int idx)
   2:  {
   3:      if (idx <= 4)
   4:      {
   5:          <span style="color: black;">Header#@idx</span>
   6:      }
   7:      else
   8:      {
   9:          <span style="color: red;">Header#@idx</span>
  10:      }
  11:  }

Расширение принимает числовой параметр, и в зависимости от его величины отрисовывает заголовок нужного размера и нужного цвета.
Если использовать это в представлении:

@for (int i = 0; i < 9; i++)
{
    @HeaderHelper(i)
}

то код напечатает 8 заголовков, и результат будет примерно таким:
В общем, думаю, вы уловили суть. И если вы до сих пор, по какой-то причине, не пользовались этой плюшкой, то смело можете пробовать. Гарантирую - это сэкономит уйму времени и нервов.