任何人都可以在 _.template 中解释 Underscore 的预编译吗?
Can anyone explain Underscore's precompilation in _.template?
我阅读了 Underscore 的文档,在 _.template
中找到:
Precompiling your templates can be a big help when debugging errors you can't reproduce. This is because precompiled templates can provide line numbers and a stack trace, something that is not possible when compiling templates on the client. The source property is available on the compiled template function for easy precompilation
我想知道它的含义和用法。
我写的代码如下:
<div>
<ul class="list">
<li>apple</li>
<li>orange</li>
<li class="last-item">peach</li>
</ul>
</div>
<script src="underscore.js"></script>
<script type="text/template" id="tpl">
<ul class="list">
<%_.each(obj, function(e, i, a){%>
<% if (i === a.length - 1) %>
<li class="last-item"><%=e.name%></li>
<% else %>
<li><%=e.name%></li>
<%})%>
</ul>
</script>
<script>
var data = [{name: "apple"}, {name: "orange"}, {name: "peach"}];
var compiled = _.template(document.getElementById("tpl").innerHTML);
var str = compiled(data);
document.querySelector("div").innerHTML = str;
</script>
它运行良好,在我看来,当我在模板中遗漏 >
时,通过预编译它会告诉我遗漏了哪一行 >
,对吗?以及如何做演示?下面的代码直接放可能就不行,那么如何让它有用呢?
<script>
JST.project = <%= _.template(jstText).source %>;
</script>
您不必使用 angular 括号。只需执行以下操作:
<script>
const yourData = {};
JST.project = _.template(jstText)(yourData);
</script>
这应该是诀窍:)
JST 是服务器端,而不是客户端。这意味着您通过某些服务器端脚本在 服务器端 上编译 Unserscore 模板并将结果保存在文件中。然后使用此文件作为已编译 Unserscore 模板。
我阅读了 Underscore 的文档,在 _.template
中找到:
Precompiling your templates can be a big help when debugging errors you can't reproduce. This is because precompiled templates can provide line numbers and a stack trace, something that is not possible when compiling templates on the client. The source property is available on the compiled template function for easy precompilation
我想知道它的含义和用法。
我写的代码如下:
<div>
<ul class="list">
<li>apple</li>
<li>orange</li>
<li class="last-item">peach</li>
</ul>
</div>
<script src="underscore.js"></script>
<script type="text/template" id="tpl">
<ul class="list">
<%_.each(obj, function(e, i, a){%>
<% if (i === a.length - 1) %>
<li class="last-item"><%=e.name%></li>
<% else %>
<li><%=e.name%></li>
<%})%>
</ul>
</script>
<script>
var data = [{name: "apple"}, {name: "orange"}, {name: "peach"}];
var compiled = _.template(document.getElementById("tpl").innerHTML);
var str = compiled(data);
document.querySelector("div").innerHTML = str;
</script>
它运行良好,在我看来,当我在模板中遗漏 >
时,通过预编译它会告诉我遗漏了哪一行 >
,对吗?以及如何做演示?下面的代码直接放可能就不行,那么如何让它有用呢?
<script>
JST.project = <%= _.template(jstText).source %>;
</script>
您不必使用 angular 括号。只需执行以下操作:
<script>
const yourData = {};
JST.project = _.template(jstText)(yourData);
</script>
这应该是诀窍:)
JST 是服务器端,而不是客户端。这意味着您通过某些服务器端脚本在 服务器端 上编译 Unserscore 模板并将结果保存在文件中。然后使用此文件作为已编译 Unserscore 模板。