backbone.js中的嵌套模板呈现

我有一个模板

script type: "text/template", id: "list-template", ''' <div class="display"> <div id="list-name"><%= name %></div> <span class="list-destroy"></span> </div> <div> <ul id="ul-cards"> </ul> </div> <div class="edit"> <input class="list-input" type="text" value="<%= name %>" /> <input id="btnEdit" type="button" value="Save" class="primary wide js-add-list" /> <input id="hdnListId" type="hidden" value="<%= listId%>" /> </div> <form class="add-list-card js-add-list-card clearfix"> <textarea placeholder="Add card" class="new-card"></textarea> <input type="button" value="Add" class="primary js-add-card"> <a class="app-icon close-icon dark-hover cancel js-cancel-add-card" href="#" id="closeCard"></a> </form> ''' 

在这个模板中，我有<ul id="ul-cards">元素，我想在这个ul里面显示另一个显示列表的模板。 这个模板是：

 script type: "text/template", id: "card-template", ''' <div> <span class="card-name"><%= name %></span> </div> ''' 

是否有可能或者我需要以另一种方式做到这一点？ 如果有人有想法，请帮助我。 感谢advace。

---

它的工作，但仍然我有一个问题在数据显示在<ul id="ul-cards">有2个

根据我的数据库中的logging，但它只会显示1

。 数据正确提取，但只显示最后的数据。

Answer 1

有两种方法可以做到这一点：DOM方式和模板方式。

DOM方式涉及到使用DOM方法添加视图：你有你的ListView和你的CardView; ListView调用填充ListView元素的各个CardView。

模板方式要求您记住这一点：骨干的意见是政策框架，而不是政策模板。 渲染不需要渲染到DOM中 。 例如，您可以使用render()来返回一个string。 如果您的事件pipe理器仅在ListView对象上（可能;我已经这样做了），那么您可以让ListView调用“CardView渲染数组的结果数组”，并将其直接插入到ListView的模板中。 这实际上更快，因为当插入到父DOM对象的innerHTML中时，只需要浏览器分析整个ListView HTML blob一次。