我如何在胡子里完成一个if/else.js？

javascript templates mustache

2022-08-30 00:06:46

似乎很奇怪，我不知道如何在胡子里做到这一点。是否受支持？

这是我可悲的尝试：

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

这显然是不对的，但文档没有提到这样的事情。“else”这个词甚至没有被提及:(

另外，为什么胡子是这样设计的？这种事情被认为是坏事吗？它是否试图强制我在模型本身中设置默认值？如果这是不可能的，那该怎么办？

答案 1

这就是你在胡子中做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

答案 2

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

// 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必然会在其他模板中使用，你是要在X模板上维护那个URL还是一个DEFAULTS设置对象？;)

另一种选择是执行以下操作：

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

在模板中：

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

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