javascript - 仅当给定 Handlebar 变量时才显示周围的 HTML

Question

是否可以仅在 Handlebar(或 Mustache)变量不为空(或不为 null 等)时显示周围的 HTML？例如，给定以下上下文和模板:

var data = {field1:123,field2:123,field3:'',field4:123};

<dl>
    <dt>field1:</dt><dd>{{field1}}</dd>
    <dt>field2:</dt><dd>{{field2}}</dd>
    <dt>field3:</dt><dd>{{field3}}</dd>
    <dt>field4:</dt><dd>{{field4}}</dd>
</dl>

将显示以下内容:

字段1:

123

字段2:

123

字段4:

123

Answer 1

您可以使用每个 block 帮助器，而不是为每个字段编写 if block

<dl>
    {{#each this}}    
        {{#if this}}
            <dt>{{@key}}</dt><dd>{{this}}</dd>
        {{/if}}
    {{/each}}
</dl>

在这里，您将遍历对象并检查当前字段是否已设置，然后显示键和值，否则移动到下一个字段。如果您有大量数据，那么它可以帮助您，那么您不需要一次又一次地编写 if block 。希望这会有所帮助。

可以在这里找到工作示例:http://jsfiddle.net/prabhat_rai/rveap9jb/