JSRender - як умовно виконувати суб-шаблон - javascript, jquery, jsrender

Я намагаюся навчитися JSRender. Чи можливо відобразити під шаблон, залежно від умови? Наприклад, якщо #index = 1 або 2, візуалізуйте шаблон A, якщо 3 або 4, візуалізуйте шаблон B?

Відповіді:

Ось правильний синтаксис - та деякі посилання на документацію нижче.

<script id="tmplFeaturePanel1" type="text/x-jsrender">
{{for List}}
{{if #index == 1 || #index == 2}}
{{include tmpl="#test1or2"/}}
{{else #index === 3 || #index === 4 }}
{{include tmpl="#test3or4"/}}
{{else}}
{{include tmpl="#testOther"/}}
{{/if}}
{{/for}}
</script>

або ще більш компактний синтаксис, який працює точно так само:

<script id="tmplFeaturePanel2" type="text/x-jsrender">
{{for List}}
{{if #index == 1 || #index == 2 tmpl="#test1or2"}}
{{else #index === 3 || #index === 4 tmpl="#test3or4"/}}
{{else tmpl="#testOther"/}}
{{/if}}
{{/for}}
</script>

де в обох випадках посилаються шаблони:

<script id="test1or2" type="text/x-jsrender">
1or2 {{:name}}
</script>

<script id="test3or4" type="text/x-jsrender">
3or4 {{:name}}
</script>

<script id="testOther" type="text/x-jsrender">
Other: {{:name}}
</script>

Побачити

• http://www.jsviews.com/#samples/jsr/composition/tmpl
• http://www.jsviews.com/#iftag
• http://www.jsviews.com/#includetag

До речі, зверніть увагу на це {{elseif ...}} або {{else if ...}} НЕ є правильним синтаксисом. Фактично {{else someExpression}} працює як інший. {{else}} працює як інше.