如何在mustache.js中实现if/else ?

这似乎相当奇怪，我不知道如何做到这一点在胡子。是否支持?

这是我悲哀的尝试:

    {{#author}}
{{#avatar}}
<img src="{{avatar}}"/>
{{/avatar}}
{{#!avatar}}
<img src="/images/default_avatar.png" height="75" width="75" />
{{/avatar}}
{{/author}}

这显然是不对的，但是文档中并没有提到类似的内容。“else”这个词甚至没有被提到:(

还有，为什么胡子是这样设计的?这种事情被认为是坏事吗?它是否试图强迫我在模型本身中设置默认值?那不可能的情况呢?

253681 次浏览
小开

这是你在“控制器”中解决的问题，这是无逻辑模板的要点。

// some function that retreived data through ajax
function( view ){


if ( !view.avatar ) {
// DEFAULTS can be a global settings object you define elsewhere
// so that you don't have to maintain these values all over the place
// in your code.
view.avatar = DEFAULTS.AVATAR;
}


// do template stuff here


}

这实际上是一个很多更好的维护图像url或其他媒体，可能会或可能不会改变你的模板，但需要一些习惯。重点是要忘记模板隧道视野，一个头像img url是绑定在其他模板中使用，你要维护该url在X个模板或一个单一的默认设置对象?；）

另一种选择是这样做:

// augment view
view.hasAvatar = !!view.avatar;
view.noAvatar = !view.avatar;

在模板中:

\{\{#hasAvatar}}
SHOW AVATAR
\{\{/hasAvatar}}
\{\{#noAvatar}}
SHOW DEFAULT
\{\{/noAvatar}}

但这违背了无逻辑模板的全部含义。如果这就是你想要做的，你想要逻辑模板，你不应该使用Mustache，尽管给自己一个学习这个概念的公平机会;)

小开

你的其他的语句应该看起来像这样(注意^):

\{\{^avatar}}
...
\{\{/avatar}}

在胡子中，这被称为“倒节”。

小开
最佳答案

这是你如何做if/else在胡子(完美支持):

\{\{#repo}}
<b>\{\{name}}</b>
\{\{/repo}}
\{\{^repo}}
No repos :(
\{\{/repo}}

或者在你的情况下:

\{\{#author}}
\{\{#avatar}}
<img src="\{\{avatar}}"/>
\{\{/avatar}}
\{\{^avatar}}
<img src="/images/default_avatar.png" height="75" width="75" />
\{\{/avatar}}
\{\{/author}}

在文档:https://github.com/janl/mustache.js#inverted-sections中寻找反向部分

小开

您可以在视图中定义一个helper。然而，条件逻辑在某种程度上是有限的。Moxy-Stencil (https://github.com/dcmox/moxyscript-stencil)似乎用“参数化”的helper来解决这个问题，例如:

\{\{isActive param}}

在视图中:

视图。isActive =函数(路径:字符串){返回路径=== this。路径?"class='active'": "}

小开

注意，你可以使用\{\{.}}来呈现当前上下文项。

\{\{#avatar}}\{\{.}}\{\{/avatar}}


\{\{^avatar}}missing\{\{/avatar}}

提交答案