Pro jQuery

Pro jQuery

Адам Фриман

Использование шаблонов данных

В этой главе вы увидите свой первый jQuery плагин; это плагин называется jQuery Templates, и он предоставляет вам возможности использовать шаблоны для простой генерации HTML элементов из объектов данных JavaScript.

Я хочу быть предельно ясным в том, что этот плагин активно не разрабатывается и не поддерживается и его не рекомендует команда разработчиков jQuery. Это не значит, что вы не должны его использовать, но вы должны быть осведомлены об этом факте, прежде чем включить этот плагин в ваши проекты. Я бы посоветовал более хорошую альтернативу для разработки, если бы я мог найти такую, который был бы такой же мощной и выразительной, как плагин jQuery Templates, но даже в заброшенном состоянии этот плагин лучший в своем роде.

История этого плагина довольно странная. Microsoft и команда jQuery объявили, что три плагина, разработанные Microsoft являются официальными, этот статус не был предоставлен больше ни одному другому плагину. Немного погодя команда jQuery объявила, что эти плагины устарели, что они лишены официального статуса и что планируется заменить их другим функционалом. Замена плагину по шаблонам должна была стать частью jQuery UI (который я описываю в части IV этой книги). К сожалению, до сих пор еще ничего не появилось, и заброшенные плагины все еще доступны и широко используются (особенно в случае плагина по шаблонам). Конечно же, решение об использовании такого кода – это личное дело каждого, но мне нравится функционал, который предлагает плагин по шаблонам, и я часто его использую. Я знаю, что я всегда могу залезть в исходный код и исправить любую серьезную проблему, а редкая необходимость обойти мелкие проблемы оправдана большой пользой этого плагина. В таблице 12-1 представлено краткое содержание этой главы.

Таблица 12-1: Краткое содержание главы
Задача Решение Листинг
Сгенерировать элементы, используя шаблон Определить шаблон в элементе script и применить его при помощи метода tmpl 1, 2, 3, 4, 5, 6
Присвоить элементы, сгенерированные шаблоном, различным предкам Либо разделить исходные данные и воспроизвести шаблон дважды, либо использовать методы slice, filter и end, чтобы разделить сгенерированные элементы 7, 8, 9
Вставить результат выражения в шаблон Включить выражение в ${...} тег шаблона 10
Получить доступ к объекту данных в шаблоне Использовать переменную $data 11
Выбрать элементы внутри шаблона Использовать jQuery функцию $ 12
Передать в шаблон опции Передать объект-карту методу tmpl и использовать переменную $item, чтобы получить доступ к опциям как к свойствам 13
Воспроизвести вложенный шаблон Использовать {{tmpl}} тег шаблона 14, 15, 16
Создать зоны условных выражений внутри шаблона Использовать {{if}} и {{else}} теги шаблона 17, 18, 19
Контролировать воспроизведение шаблона по пунктам в массиве Использовать {{each}} тег шаблона 20, 21
Отключить HTML-безопасную кодировку значений данных, вставленных в шаблон Использовать {{html}} тег шаблона 22, 23
Представить элементы, используя различные шаблоны или значения данных Использовать метод $.tmplItem, чтобы получить объект шаблона. Использовать свойства объекта, чтобы изменить шаблон или данные, и вызвать метод для обновления, чтобы сгенерировать контекст заново 24, 25, 26

Понимание задачи, которую решают шаблоны

Установка библиотеки jQuery Templates

Первый пример использования шаблона данных

Использование переменных шаблона

Использование вложенных шаблонов

Использование условий в шаблонах

Управление итерацией по массивам

Отключение HTML кодировки

Манипулирование шаблонами из функций обработки событий

Резюме

или RSS канал: Что новенького на smarly.net