小胡子-有條件地根據數組數據呈現列表

Question

我有一個現有的應用程序，該應用程序使用Mustache.js進行模板制作，並且需要有條件地渲染來自服務器的數組數據（json）的列表。 小胡子有可能嗎？

一些示例數據：

"Preferences": ["pref-red", "pref-blue"]

很容易通過以下方式輸出：

<ul class="plain">
    {{#Preferences}}
    <li>{{.}}</li>
    {{/Preferences}}
</ul>

但是我真正想做的是根據返回的首選項數據有條件地呈現靜態列表的適當部分。 一些非常愚蠢的偽代碼：

<ul class="plain">
    {{#Preferences}}
        {{if pref-red}}<li class="icon red bell">Red</li>{{/if}}
        {{if pref-green}}<li class="icon green car">Green</li>{{/if}}
        {{if pref-blue}}<li class="icon blue cat">Blue</li>{{/if}}
        {{if pref-yellow}}<li class="icon yellow flower">Yellow</li>{{/if}}
        {{if pref-purple}}<li class="icon purple house">Purple</li>{{/if}}
    {{/Preferences}}
</ul>

在這種情況下，它將在瀏覽器中輸出為：

<ul class="plain">
    <li class="icon red bell">Red</li>
    <li class="icon blue cat">Blue</li>
</ul>

我知道小胡子沒有條件，但是可以在小胡子中實現嗎？ 如果可能的話，我希望將其保留在Mustache中（減少，重復使用，回收）。

Answer 1

不，按原樣，Mustache無法實現此目的。

您有兩個選擇：

• 轉換您的輸入數據，以便可以由Mustache呈現。
• 更改渲染引擎。 您已經將handlebars.js標記添加到了您的問題：您已經有了答案。