шаблонизатор mustache
Ось, що ми отримаємо в результаті:
Щоб те, що ми все робимо не здавалася містикою, перейдемо до теорії.
Типи тегів в Mustache
Теги в Mustache позначаються подвійними фігурними дужками, наприклад: # 123; # 123; person # 125; # 125 ;. # 123; # 123; # person # 125; # 125 ;. В обох прикладах ми говоримо про person як про ключі? або ключових тегах. Давайте поговоримо про різні типи тегів ..
змінні
Змінні - основний і найпростіший тип тега в Mustache. тег # 123; # 123; name # 125; # 125; в базовому шаблоні буде намагатися знайти ключ імені в поточному контексті. Якщо ключ імені не знайдений, батьківські контексти будуть перевірятися рекурсивно. У випадку досягнення верхній контекст і ключ імені так і не знайдений, нічого рендери не буде.
Значення змінних відображаються HTML-безпечним чином, тобто всі HTML теги замінюються на їх кодовані еквіваленти. Для відображення HTML-коду без змін використовуйте потрійні фігурні дужки, замість подвійних: # 123; # 123; # 123; name # 125; # 125; # 125; .
Також можна використовувати для скасування екранування змінної: # 123; # 123; name # 125; # 125 ;. Цим можна скористатися при зміні обмежувачів тегів (докладніше в розділі Зміна обмежувачів тегів).
За замовчуванням, відсутня змінна повертає порожній рядок. Якщо вас це не влаштовує, налаштуйте це правило в бібліотеці Mustache. Ruby версія Mustache підтримує підвищення виняток у цій ситуації, наприклад:
Задамо дані для цього шаблону. Зверніть увагу, що ми не стали вказувати в об'єкті властивість age. Зараз щось буде)
Результат нашої роботи наведено нижче. Ви помітили, що в консолі помилки немає, а там, де повинен бути вказаний вік Кріса - порожній рядок?
Секції Рендер блоки з текстом один, або більше разів, в залежності від значення ключа в поточному контексті. Секції відкриваються тегом і закривающтя тегом. Поведінка секції визначається значенням ключа: Секція відображається, якщо відповідна їй змінна має булевий тип і її значення дорівнює true. або ця змінна є непустою списком. Проілюструємо це на прикладі. Наш шаблон:
Дані для виведення:
непусті списки
Якщо секції відповідає непорожній список, то секція відображається для кожного елемента цього списку. При цьому контекстом для відображення вмісту секції стає черговий елемент. Напишіть такий простенький шаблон:
А для нього такі дані:
В результаті отримаємо:
Дані представити трохи більше понятнеей і більш компактно:
І отримати те ж саме.
Якщо значення є викликається об'єкт (функція або лямбда), він буде викликатися і передавати блок тексту. Рухаючись текст являє собою неотрендеренний блок символів. # 123; # 123; tags # 125; # 125; необхідно буде розширити - lambda зробить це самостійно. В цьому випадку ви можете реалізувати фільтри або кешування.
Візьмемо і напишемо такий шаблон:
І приготуємо для нього такі дані:
Неошібочние значення
Якщо значення є неошібочним, але не є списком, воно буде використано в якості контексту для одиночного рендеринга блоку.
Візьмемо ось такий шаблон:
Дані для виведення будуть такими:
Ось, що ми отримаємо на виході:
інвертовані секції
Інвертованою секцією називається секція, що відкривається тегом # 123; # 123; ^ імя_секціі # 125; # 125 ;. а закінчується - # 123; # 123; / імя_секціі # 125; # 125 ;. У той час як секції можуть бути використані для візуалізації тексту один, або кілька разів, в залежності від значення ключа, інвертовані ділянки можуть відображати текст, як тільки при зворотному значенню ключа. Тобто, вони будуть відображатися, якщо ключ не існує, є хибним, або список порожній.
Наведемо приклад, щоб вам було зрозуміліше. шаблон:
В результаті отримаємо:
Це буде отрендеріть наступним чином:
Відокремлені фрагменти
Відокремлені фрагменти відкриваються тегом # 123; # 123;<имя фрагмента}}. а закрываются - {{/имя фрагмента}} .
Відокремлені фрагменти Рендер під час виконання (на відміну від компіляції), тому можлива поява рекурсивних приватних значень. Таким способом уникають зациклення.
Для Mustache потрібно тільки це:
Чому? Тому що файл next_more.mustache успадковує розмір і методи запуску від зухвалої контексту.
Таким чином, ви можете розглядати приватні значення, такі як включення, обсяги імпорту, розширення шаблонів, вбудовані шаблони, або подшаблони, навіть незважаючи на те, що в буквальному сенсі це не так. Наприклад, розглянемо цей шаблон і відокремлений фрагмент:
Можна вважати поодиноким розширеним шаблоном:
Зміна обмежувачів тегів
Можна змінити обмежувачі тегів з # 123; # 123; # 125; # 125; на іншу послідовність символів, що не містить прогалини і символ =. Розглянемо наступний приклад:
Тут у нас є список з трьома пунктами. Перший пункт використовує стиль обмежувачів тегів за умовчанням ( # 123; # 123; # 125; # 125; ), Другий використовує вже інший стиль ( <% %> ), А третій повертається до вихідного стилю. Це може бути корисно для таких мов, як TeX. де подвійні фігурні дужки можуть виникнути в тексті і ними незручно буде користуватися для розмітки.
На цьому наше вивчення шаблонізатора Мustache підійшло до кінця. На останок залишаю вам невеликий приклад роботи c Мustache на той випадок, якщо щось залишилося незрозуміло. Успіхів!
- unity