具有字符串相等函数的车把 If-Else If-Else
Handlebars If-Else If-Else With String Equality Function
HandlebarsJS 不支持字符串相等('==')所以我必须编写自己的助手,但这个答案不清楚:
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?
您示例中的助手是块助手。这个助手被恰当地命名为 if_eq
因为它接受两个表达式,如果这些表达式相等,它就会渲染块中的内容。如果表达式 不 相等,则 return opts.inverse(this);
行会渲染 else
块(参见:http://handlebarsjs.com/block_helpers.html#conditionals)。
如果您希望能够在模板中链接 else if
条件,则不能使用自定义块助手。相反,您必须使用常规(非块)Handlebars helper。块助手将呈现模板块,而常规助手将 return 一个值。在您的情况下,我们将 return 一个布尔值,指示所有参数是否相等。这样的助手可能如下所示:
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
块助手。
我创建了一个JS Fiddle供您参考。
更新
上面的答案表明您不能使用 else if
链接块助手。这是误导。事实上,if
本身就是 一个块助手;并且可以使用 else
关键字将任意多个 if
块链接在一起。甚至 不同的 块助手也可以用这种方式链接起来。
解决发帖者第一个问题的重点是不能在同一个胡须中使用两个块助手。也就是说,如果 if_eq
是块助手,则 {{#if 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 示例。
HandlebarsJS 不支持字符串相等('==')所以我必须编写自己的助手,但这个答案不清楚:
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?
您示例中的助手是块助手。这个助手被恰当地命名为 if_eq
因为它接受两个表达式,如果这些表达式相等,它就会渲染块中的内容。如果表达式 不 相等,则 return opts.inverse(this);
行会渲染 else
块(参见:http://handlebarsjs.com/block_helpers.html#conditionals)。
如果您希望能够在模板中链接 else if
条件,则不能使用自定义块助手。相反,您必须使用常规(非块)Handlebars helper。块助手将呈现模板块,而常规助手将 return 一个值。在您的情况下,我们将 return 一个布尔值,指示所有参数是否相等。这样的助手可能如下所示:
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
块助手。
我创建了一个JS Fiddle供您参考。
更新
上面的答案表明您不能使用 else if
链接块助手。这是误导。事实上,if
本身就是 一个块助手;并且可以使用 else
关键字将任意多个 if
块链接在一起。甚至 不同的 块助手也可以用这种方式链接起来。
解决发帖者第一个问题的重点是不能在同一个胡须中使用两个块助手。也就是说,如果 if_eq
是块助手,则 {{#if 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 示例。