6

HandlebarsJS doesn't support string equality ('==') so I have to write my own helper, but this answer isn't clear:

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

and then adjust your template:

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

1) Why is he doing {{#if_eq ..}} rather than {{#if if_eq .. }} ?

2) I also need to do ELSE-IF, which is supported since Handlebars 3.0.0 (I have 4.0). But using his notation, I wouldn't be able to do {{#elseif_eq}} there is no such expression. How would I implement an ELSE-IF with this custom helper?

4

1 回答 1

13

您示例中的助手是块助手。助手的命名恰如其分if_eq,因为它需要两个表达式,如果这些表达式相等,它会渲染块中的​​内容。如果表达式相等,则该return opts.inverse(this);行会渲染块(请参阅: http ://handlebarsjs.com/block_helpers.html#conditionals )。else

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

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表达式。括号告诉 Handlebars 将相等检查的结果传递给#if块助手。

我创建了一个JS Fiddle供您参考。

更新

上面的答案表明您不能使用else if. 这是误导。实际上,if本身就是一个块助手;if并且可以使用else关键字将任意多个块链接在一起。甚至可以以这种方式链接不同的块助手。

解决发帖人第一个问题的重点是不能在同一个小胡子中使用两个块助手。也就是说,{{#if if_eq ... }}如果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}}

请看这个小提琴的例子。

于 2017-12-07T02:27:43.427 回答