下划线插值设置

Question

我正试图在主干中使用带有下划线的把手样式模板(使用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}

任何想法为什么这不能正常工作？

Answer 1

当我这样做:

_.templateSettings.interpolate = /\{\{(.+?)\}\}/g;
var t = _.template($('#t').html());

使用您的模板#t,我收到一个错误:

SyntaxError:意外的标记'='

这很好地证实了我怀疑评估正则表达式:

/<%([\s\S]+?)%>/g

<%= ... %>在模板中匹配您的.等号符合匹配,\S因此评估正则表达式会找到<%= ... %>,剥离<%和%>,并在JavaScript中_.template尝试构建语法错误.

如果查看_.template源代码,您将看到以特定顺序检查正则表达式:

1. escape
2. interpolate
3. evaluate

因此,只是替换interpolate会让<%= ... %>事情陷入陷阱(并被误解)但是evaluate.

您需要做的就是替换evaluate正则表达式.我建议更换所有三个正则表达式以避免出现问题:

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

演示:http://jsfiddle.net/ambiguous/SdLsn/