Data v Eleventy 2

Filtry

Pomáhají transformovat proměnné. Zapisují se pomocí symbolu svislé čáry ({{ promenna | filtr }}).

Pokud bychom chtěli například vypsat počet položek v kolekci, uděláme to v šabloně takto:

<div>Počet filmů v kolekci: {{ filmy | length }}</div>

Výsledek v HTML bude vypadat takto:

<div>Počet filmů v kolekci: 5</div>

Slug

Pro převod textu na znaky vhodné pro URL adresu používáme filtr slug.

<div>Název: {{ filmy.nazev }}</div>
<div>URL: /film/{{ filmy.nazev | slug }}</div>

Výsledek v HTML bude vypadat takto:

<div>Název: Pán prstenů</div>
<div>URL: /film/pan-prstenu</div>

Spojení kolekce

Pokud máme v kolekci samé řetězce, můžeme je spojit dohromady pomocí filtru join.

zanry.json

["Sci-Fi", "Komedie", "Romantický"]

sablona.njk

<div>{{ zanry | join }}</div>

Výsledek:

<div>Sci-FiKomedieRomantický</div>

Pokud chceme použít vlastní oddělovač, například čárku navíc s mezerou, přidáme za join parametr do kulatých závorek v uvozovkách.

sablona.njk

<div>{{ zanry | join(', ') }}</div>
<div>{{ zanry | join(' / ') }}</div>

Výsledek:

<div>Sci-Fi, Komedie, Romantický</div>
<div>Sci-Fi / Komedie / Romantický</div>

Další filtry

Všechny zabudované filtry do nunjucks jsou popsané v dokumentaci zde.

Přejmenování proměnné

Pomocí {% set %} můžeme vytvářet nové proměnné, které dokonce můžou vycházet z již existujících.

{% set nejoblibenejsiCislo = 12 %}
<div>Nejoblíbenější číslo je: {{ nejoblibenejsiCislo }}</div>

{% set filmy = noveFilmy %}
<h2>Nové filmy</h2>
<ul>
	{% for film in filmy %}
		<li>
			{{ film }}
		</li>
	{% endfor %}
</ul>

Může se hodit například v případě, že máme šablonu, která očekává určitý název proměnné, ale z dat ji máme pojmenovanou jinak.

{% set filmy = mojeFilmy.oblibene %}
<h2>Oblíbené filmy</h2>
{% include "seznamFilmu.njk" %}

{% set filmy = mojeFilmy.chciVidet %}
<h2>Chci vidět</h2>
{% include "seznamFilmu.njk" %}

Úkol na teď

Postupuj podle zadání na github.com/…/Cviceni-Eleventy-filmy.