templates - Handlebars If-Else If-Else 与字符串相等函数

Question

HandlebarsJS 不支持字符串相等('==')，所以我必须编写自己的助手，但这个答案不清楚:

https://stackoverflow.com/a/15095019/1005607

Handlebars.registerHelper('if_eq', function(a, b, opts) {
    if(a == b) // Or === depending on your needs
        return opts.fn(this);
    else
        return opts.inverse(this);
});

然后调整您的模板:

{{#if_eq this "some message"}}
    ...
{{else}}
    ...
{{/if_eq}}

1) 为什么他做 {{#if_eq ..}} 而不是 {{#if if_eq .. }} ？

2) 我还需要执行ELSE-IF，这是从 Handlebars 3.0.0 开始就支持的(我有 4.0)。但是使用他的符号，我将无法执行 {{#elseif_eq}} 没有这样的表达式。我如何使用这个自定义助手实现 ELSE-IF？

Answer 1

示例中的帮助程序是 block 帮助程序。该助手被恰本地命名为 if_eq，因为它需要两个表达式，如果这些表达式相等，它就会渲染 block 中的​​内容。如果表达式不相等，则 return opts.inverse(this); 行将渲染 else block (请参阅: http://handlebarsjs.com/block_helpers.html#conditionals )。

如果您希望能够在模板中链接 else if 条件，则不能使用自定义 block 助手。相反，您必须使用常规(非 block )Handlebars helper 。 block 助手将渲染模板 block ，而常规助手将返回一个值。在您的情况下，我们将返回一个 bool 值，指示所有参数是否相等。这样的助手可能如下所示:

Handlebars.registerHelper('eq', function () {
    const args = Array.prototype.slice.call(arguments, 0, -1);
    return args.every(function (expression) {
        return args[0] === expression;
    });
});

您可以按以下方式在模板中使用此帮助程序:

{{#if (eq val1 val2)}}
    <p>IF Branch</p>
{{else if (eq val2 val3)}}
    <p>ELSE IF Branch</p>
{{else}}
    <p>ELSE Branch</p>
{{/if}}

请注意代码 (eq val1 val2) 中的括号。这些括号是必需的，因为我们的 eq 计算结果是 #if 表达式中的 subexpression。括号告诉 Handlebars 将相等检查的结果传递给 #if block 助手。

我创建了一个 JS Fiddle 供您引用。

更新

上面的答案表明您不能使用 else if 链接 block 助手。这是误导性的。事实上，if 本身就是一个 block 助手；并且可以使用 if 关键字将任意多个 else block 链接在一起。即使不同的 block 助手也可以通过这种方式链接起来。

解决发帖者第一个问题的重要一点是，两个 block 助手不能在同一个 mustache 中使用。也就是说，如果 {{#if if_eq ... }} 是 block 助手，则 if_eq 无效。但是，使用 if_eq 是完全有效的，如下所示:

{{#if_eq this 'some message'}}
    <p>If branch.</p>
{{else if_eq this 'some other message'}}
    <p>Else if branch.</p>
{{else}}
    <p>Else branch.</p>
{{/if_eq}}

请参阅此 fiddle 作为示例。