我正在尝试在主干中使用带有下划线的把手样式模板(使用require.js)。 我有以下内容:
_.templateSettings.interpolate = /\{\{(.+?)\}\}/g;
在我的模板中,我设置了一个测试:
<div><%= title %> | {{ title }}</div>
我在浏览器中收到以下内容:
Correct title | {{ title }}
所以看起来标准的下划线模板设置正在运行,并且把手样式设置被忽略了:
但是,如果我在Chrome中检查控制台,我会得到这个(在我看来它应该是正确的)
_.templateSettings
Object {evaluate: /<%([\s\S]+?)%>/g, interpolate: /\{\{(.+?)\}\}/g, escape: /<%-([\s\S]+?)%>/g}
为什么这不能正常工作?
答案 0 :(得分:16)
当我这样做时:
_.templateSettings.interpolate = /\{\{(.+?)\}\}/g;
var t = _.template($('#t').html());
将您的模板放在#t
中,我收到错误消息:
SyntaxError:意外的标记'='
很好地证实了我怀疑评估正则表达式:
/<%([\s\S]+?)%>/g
正在模板中匹配您的<%= ... %>
。等号符合\S
,因此评估正则表达式会找到<%= ... %>
,剥离<%
和%>
,并在JavaScript中留下语法错误{{} {1}}将尝试构建。
如果您查看_.template
source内部,您会看到按特定顺序检查正则表达式:
_.template
escape
interpolate
因此,只需替换evaluate
即可让interpolate
内容陷入(并被误解),但<%= ... %>
。
您需要做的就是替换evaluate
正则表达式。我建议更换所有三个正则表达式以避免出现问题:
evaluate