如何使用Underscore.js和HAML插值if/else语句？

Question

我正在尝试在Underscore.js和HAML中使用if/else插值，但是一直无法成功。我已经将Underscore.js中的插值设置更改为以下内容：

_.templateSettings = {
  interpolate : /\{\{([\s\S]+?)\}\}/g
};

这个方法在我尝试在 {{ value }} 这样的符号内插入值时很有效。但是，我不能使 if/else 语句生效。我有以下代码：

{{ if (true) { }}
  {{ val }}
{{ } }}

我遇到了一个 JavaScript 异常 "Uncaught SyntaxError: Unexpected token if"。非常感谢帮助。

- Bryan

Answer 1

Underscore模板使用三种不同的定界符：

1. evaluate：用于JavaScript代码块，默认为<% ... %>。
2. interpolate：用于输出变量内容，默认为<%= ... %>。
3. escape：与interpolate相似，但会对HTML进行转义，默认为<%- ... %>。

这些大都类似于ERB语法。您正在尝试在非表达式的JavaScript中使用插值语法：

{{ if(true) { }}

但是在JavaScript中，这不起作用，因为if不是表达式。

您可能想要覆盖所有三个模式：

_.templateSettings = {
  evaluate    : /\{\{([\s\S]+?)\}\}/g,
  interpolate : /\{\{=([\s\S]+?)\}\}/g,
  escape      : /\{\{-([\s\S]+?)\}\}/g
};

然后说出这样的话：

{{ if (true) { }}
  {{= val }}
{{ } }}

如果你能将模板限制为简单的替换，那么你可以在模板中使用interpolate和{{expr}}。

- mu is too short