gpt4 book ai didi

javascript - 列表未在 underscore.js 中呈现

转载 作者:行者123 更新时间:2023-12-02 18:22:28 24 4
gpt4 key购买 nike

我是 underscore.js 的新手,我希望以下内容能够呈现传递给它的列表,但它却呈现此:

Title: {{title}}
Author: {{author}}

这是一个片段:

<script src="/Scripts/underscore.js"></script>
<script id="tmpl-books" type="text/template">
<ul>
<li>Title: {{title}}</li>
<li>Author: {{author}}</li>
</ul>
</script>

<script type="text/javascript">
var list =
[
{
"title": "Myst: The Book of Atrus",
"author": "Rand Miller"
},
{
"title": "The Hobbit",
"author": "J.R.R. Tolkien"
},
{
"title": "Stardust",
"author": "Neil Gaiman"
}
];

$(document).ready(function () {
var tmplMarkup = $('#tmpl-books').html();
var compiledTmpl = _.template(tmplMarkup, list);
$('#rendered').html(compiledTmpl);
});
</script>
<小时/>

在 Html 主体中,我有一个 id="rendered"的 div

<html> 
<body>
<div id="rendered"></div>
</body>
</html>
<小时/>

最佳答案

大括号是 Mustache.js 样式。下划线使用 <%= %>语法:

<li>Title: <%= title %></li>

此外,Underscore.js 模板期望名称“title”等位于您传递的对象映射中。据我所知,你不能传递数组。相反,将数组包装在“items”中,如下所示:

var list = { items: [ ... ] };

并使用迭代它们的模板:

 <% _.each(items, function(item) { %>
<ul>
<li>Title: <%= item.title %></li>
<li>Author: <%= item.author %></li>
</ul>
<% }); %>

Fiddle demo

关于javascript - 列表未在 underscore.js 中呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18702358/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com