Question

我正在努力学习JSRender。是否可以根据条件渲染子模板？例如，如果#index = 1或2，渲染模板A，如果是3或4，则渲染模板B？

Answer 1

以下是正确的语法 - 以及下面的一些文档链接。

<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>

见

BTW请注意，{{elseif ...}}或{{else if ...}}不是正确的语法。实际上{{else someExpression}}作为一个elseif工作。 {{else}}作为其他人工作。

JSRender - 如何有条件地呈现子模板

1 个答案: