下划线不生成 HTML
Underscore does not generate HTML
以下代码未生成 HTML。
下划线模板:
<script type="text/template" id="features-template">
<li class="list-group-item">
<span class="badge"><%= score %></span>
<%= prediction %>
</li>
</script>
JSON:
{
"features": {
"status": true,
"response": {
"predictions": [
["shirt", "90.12"],
["jeans", "09.88"]
]
}
}
}
jQuery代码:
var predictions = [];
_.each(response.features.response.predictions, function(prediction, i) {
predictions.push({
prediction: prediction[0],
score: prediction[1]
});
});
var tpl = _.template(featureTemplate, predictions));
console.log( tpl);
我可以看到预测数组是用值创建的。
为什么此代码不能生成正确的 HTML?
我用最新版underscore(1.8.3)测试,其他版本可能有差异
documentation of _.template表示数据是在编译模板后给出的:
var compiled = _.template(featureTemplate);
var tpl = compiled({predictions:predictions});
我还在模板中添加了一个foreach循环:
<script type="text/template" id="features-template">
<% _.each(predictions, function(prediction) { %>
<li class="list-group-item">
<span class="badge"><%= prediction.score %></span>
<%= prediction.prediction %>
</li>
<% }); %>
</script>
以下代码未生成 HTML。
下划线模板:
<script type="text/template" id="features-template">
<li class="list-group-item">
<span class="badge"><%= score %></span>
<%= prediction %>
</li>
</script>
JSON:
{
"features": {
"status": true,
"response": {
"predictions": [
["shirt", "90.12"],
["jeans", "09.88"]
]
}
}
}
jQuery代码:
var predictions = [];
_.each(response.features.response.predictions, function(prediction, i) {
predictions.push({
prediction: prediction[0],
score: prediction[1]
});
});
var tpl = _.template(featureTemplate, predictions));
console.log( tpl);
我可以看到预测数组是用值创建的。
为什么此代码不能生成正确的 HTML?
我用最新版underscore(1.8.3)测试,其他版本可能有差异
documentation of _.template表示数据是在编译模板后给出的:
var compiled = _.template(featureTemplate);
var tpl = compiled({predictions:predictions});
我还在模板中添加了一个foreach循环:
<script type="text/template" id="features-template">
<% _.each(predictions, function(prediction) { %>
<li class="list-group-item">
<span class="badge"><%= prediction.score %></span>
<%= prediction.prediction %>
</li>
<% }); %>
</script>