在 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);
  }
});

即。 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}