小胡子模板:如何为非空列表仅输出一次块

Question

如果我的列表为空,我想输出:

<div id="some-id">
</div>

如果我的列表非空,我想输出:

<div id="some-id">
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>etc</li>
  </ul>
</div>

请注意,我最多只输出一次<ul> and </ul>标签,并且仅在列表非空时输出.

下面的代码接近我在PHP中如何做到这一点,但显然是错误的:

<div id="some-id">
{{#items}}
  <ul>
{{/items}}

{{#items}}
    <li>{{name}}</li>
{{/items}}

{{#items}}
  </ul>
{{/items}}
</div>

如果items是一个3项目列表,我将得到3 <ul>- 显然不是我想要的.

我意识到我可以设置一些其他键作为布尔标志(hasItems也许),但这感觉多余.

是否有一种更优雅的方式我只能为非空列表输出一次块？

Answer 1

如果您不想或不能重新格式化数据或模板引擎,您也可以items.length在呈现<ul>标记之前进行检查.有些人对此不以为然,但它肯定是Max答案的替代品.

{{#items.length}}
    <ul>
        {{items}}
            <li>{{name}}</li>
        {{/items}}
    </ul>
{{/items.length}}

尼斯.但这只适用于JavaScript的JavaScript实现,对吧？ (5认同)
是的，但大多数语言都有某种属性或方法，您可以检查这些属性或方法来获取数组的长度……对于 java，它是`.size` 等。所以它_应该_翻译成大多数语言。 (2认同)

Answer 2

您可以使用节的非假值。name一定是里面的物体items

data = { 'items' : { 'name' : ["Item 1", "Item 2", "etc"] } };

您的模板如下所示：

<div id="some-id">
    {{#items}}
    <ul>
        {{#name}}
        <li>{{.}}</li>
        {{/name}}
    </ul>
    {{/items}}
</div>

这是jsFiddle上的示例，显示了items带有名称但不带名称的对象的渲染-http : //jsfiddle.net/maxbeatty/fpQwk/