Tipy a triky

Editory a IDE

Efektivní práce s Latte šablonami začíná u správně nastaveného vývojového prostředí. Vhodný editor nebo IDE s podporou Latte vám významně usnadní práci a zvýší produktivitu.

• PhpStorm: v Settings > Plugins > Marketplace nainstalujte plugin Latte
• VS Code: nainstalujte Nette Latte + Neon, Nette Latte templates nebo nejnovější Nette for VS Code plugin
• NetBeans IDE: nativní podpora Latte je součástí instalace
• Sublime Text 3: přes Package Control nainstalujte balíček Nette a v View > Syntax zvolte Latte
• Pro starší editory: použijte zvýrazňování syntaxe pro Smarty u souborů s příponou .latte

Plugin pro PhpStorm vyniká pokročilými funkcemi a nabízí vynikající napovídání PHP kódu. Pro jeho optimální funkčnost doporučujeme používat typované šablony.

Podporu Latte najdete také v online zvýrazňovači kódu Prism.js a webovém editoru Ace.

Latte uvnitř JavaScriptu nebo CSS

Latte lze velmi pohodlně používat i uvnitř JavaScriptu nebo CSS. Jak se však vyhnout situaci, kdy by Latte mylně považovalo JavaScriptový kód nebo CSS styl za Latte značku?

<style>
	/* CHYBA: interpretuje jako značku {color} */
	body {color: blue}
</style>

<script>
	// CHYBA: interpretuje jako značku {id}
	var obj = {id: 123};
</script>

Existuje několik řešení:

Řešení 1: Oddělení závorek

Vložte mezeru, odřádkování nebo uvozovku mezi { a následující písmeno:

<style>
	body {
		color: blue
	}
</style>

<script>
	var obj = {'id': 123};
</script>

Řešení 2: Vypnutí zpracování Latte

Použijte atribut n:syntax pro úplné vypnutí zpracování Latte značek v daném elementu:

<script n:syntax="off">
	var obj = {id: 123};
</script>

Řešení 3: Změna syntaxe Latte

Přepněte na syntaxi s dvojitými složenými závorkami uvnitř elementu:

<script n:syntax="double">
	var obj = {id: 123};          // tohle je JavaScript

	{{if $cond}} alert(); {{/if}} // tohle je Latte
</script>

Pamatujte, že v JavaScriptu se nepoužívají uvozovky kolem proměnných.

Náhrada use v Latte

V PHP používáme use pro zkrácení zápisu názvů tříd. Jak lze dosáhnout podobného efektu v Latte? Příklad v PHP:

use Pets\Model\Dog;

if ($dog->status === Dog::StatusHungry) {
	// ...
}

V Latte máme dvě hlavní možnosti:

Možnost 1: Uložení názvu třídy do proměnné

{var $Dog = Pets\Model\Dog::class}

<div>
	{if $dog->status === $Dog::StatusHungry}
		...
	{/if}
</div>

Možnost 2: Využití instance objektu

Pokud je $dog instancí Pets\Model\Dog, můžeme použít:

<div>
	{if $dog->status === $dog::StatusHungry}
		...
	{/if}
</div>

Generování XML v Latte

Latte může generovat jakýkoli textový formát (HTML, XML, CSV, iCal atd.), nicméně aby správě escapovalo vypisované data, musíme mu říct, jaký formát generujeme. K tomu slouží značka {contentType}.

{contentType application/xml}
<?xml version="1.0" encoding="UTF-8"?>
...

Příklad generování sitemapy:

{contentType application/xml}
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
	<url n:foreach="$urls as $url">
		<loc>{$url->loc}</loc>
		<lastmod>{$url->lastmod->format('Y-m-d')}</lastmod>
		<changefreq>{$url->frequency}</changefreq>
		<priority>{$url->priority}</priority>
	</url>
</urlset>

Předávání dat z vložené šablony

Proměnné vytvořené pomocí {var} nebo {default} ve vložené šabloně jsou lokální a nejsou dostupné v šabloně, která je vkládá. Pokud potřebujete předat data zpět do vkládající šablony, můžete využít objektu jako prostředníka.

Hlavní šablona:

{* vytvoří prázdný objekt $vars *}
{var $vars = (object) null}

{include 'included.latte', vars: $vars}

{* nyní obsahuje property foo *}
{$vars->foo}

Vložená šablona included.latte:

{* zapíšeme data do property foo *}
{var $vars->foo = 123}

Tento přístup umožňuje efektivní sdílení dat mezi šablonami při zachování čistého a přehledného kódu.