javascript - 在 Handlebars 模板中的 If 块内调用 Helper

Question

我正在使用 Handlebars.js 模板引擎，并试图找出一种方法来做这样的事情（人为的例子）：

{{#if itemSelected "SomeItem"}}
    <div>This was selected</div>
{{/if}

itemSelected像这样的注册助手在哪里：

Handlebars.registerHelper("itemSelected", function(item) {
    var selected = false;
    // Lots of logic that determines if item is selected
    return selected;
});

尝试将此语法用于模板时出现错误，并且找不到任何显示此类内容的示例。我确实看到像这样的简单#if 块......

{{#if myValueInContext}}
    <div>This will show if myValueInContext results in a truthy value.</div>
{{/if}}

但是，我不知道如何处理第一个例子。也许我正在接近这个错误。

顺便说一句，我标记了这个 Mustache，因为我无法在问题中添加 Handlebars 标记。

Answer 1

您应该在嵌入式帮助器调用周围添加括号：

{{#if (itemSelected "SomeItem")}}
    <div>This was selected</div>
{{/if}

我做了实验并验证它确实有效。

不确定 Handlebars 文档中是否提到过。我从handlebars-layouts的例子中学到了诀窍。

Answer 2

对于 Handlebars 的最新版本 (1.0.rc.1)，您必须编写如下内容：

Handlebars.registerHelper('ifItemSelected', function(item, options) {
  var selected = false;
  // lots of logic that determines if item is selected

  if (selected) {
    return options.fn(this);
  }
});

IE。block(this)被options.fn(this)替换

http://handlebarsjs.com/block_helpers.html#conditionals

Answer 3

我认为这行不通。如果我正确理解车把文档，#if 本身就是一个已注册的块助手，并且不会将另一个已注册的助手作为参数。

根据文档，您可以像这样实现它

Handlebars.registerHelper('ifItemSelected', function(item, block) {
  var selected = false;
  // lots of logic that determines if item is selected

  if(selected) {
    return block(this);
  }
});

之后你应该可以用它来调用它

{{#ifItemSelected SomeItem}}
    This was selected
{{/ifItemSelected}

但您必须确保SomeItem具有正确的格式。我看不到在 if 语句中使用注册处理程序作为条件的方法。

Answer 4

如果你也想有一个 else 选项，你将需要这个代码：

Handlebars.registerHelper('ifItemSelected', function(item, options) {
  var selected = false;
  // lots of logic that determines if item is selected

  if (selected) {
    return options.fn(this);
  }
  else {
   return options.inverse(this);
 }
});

用于：

{{#ifItemSelected SomeItem}}
    This was selected
{{else}}
    This was not selected
{{/ifItemSelected}