如何使用Backbone.Marionette处理嵌套的CompositeView？
我正在使用Backbone进入更大规模的数据结构，并遇到通过CompositeViews很好地表示数据的场合; 也就是说，CollectionViews在它们周围增加了“添加绒毛”，例如标题，按钮等。
但是，我在将CompositeViews嵌套在一起时遇到了很多困难。 使用CompositeView上的标准itemView属性来渲染另一个CompositeView似乎根本没有触发。
假设我有一个父ItemView ，如此实例化（遵循Derick Bailey的例子 ;假设这个顶级是调用集合上的初始fetch()的地方）：
var User = Backbone.Model.extend({}); var UserCollection = Backbone.Collection.extend({ model: User }); var userList = new UserCollection(userData); var schedulerCompositeView = new SchedulerCompositeView({ collection: userList }); schedulerCompositeView.render(); this.ui.schedulerWidget.html(schedulerCompositeView.el);
而SchedulerCompositeView看起来像这样：
return Backbone.Marionette.CompositeView.extend({ template: Handlebars.compile(schedulerCompositeViewTemplate), itemView: SchedulerDetailCompositeView, appendHtml: function (collectionView, itemView) { collectionView.$("#schedulerGroups").append(itemView.el); } });
最后， SchedulerDetailCompositeView ：
return Backbone.Marionette.CompositeView.extend({ template: Handlebars.compile(schedulerDetailCompositeViewTemplate), itemView: SchedulerDetailItemView, appendHtml: function (collectionView, itemView) { collectionView.$("#schedulerDetailStops").append(itemView.el); } });
SchedulerDetailCompositeView永远不会被实例化; 事实上，它的appendHtml()方法似乎永远不会发生。
显然，这里缺少一些其他信息; 显然，目的是将一个集合/模型传递给SchedulerDetailCompositeView，但由于嵌套的CompositeViews，我不确定这样做的正确方法是什么。
作为参考，这是我想要实现的结构的粗略模型; 如果可能有更好的方式来实现这个目标而不是嵌套的CompositeViews，我当然都是耳朵：
http://jsfiddle.net/KAWB8/
找到了！ 我被deven98602设置在正确的道路上。
要记住的关键是，如果要嵌套多个CompositeViews（或CollectionViews），则每个级联级别将代表其父级的一个单元; 也就是说，我之前的SchedulerDetailCompositeView表示SchedulerCompositeView中集合中的单个模型。 因此，如果我正在构建嵌套的CompositeViews（可能是基于深层嵌套的数据），我必须重新定义这些级联子节点上的集合，因为它们只有一个与它们相关联的模型，而不是要呈现的适当集合。
也就是说，更新的SchedulerDetailCompositeView看起来像这样：
return Backbone.Marionette.CompositeView.extend({ template: Handlebars.compile(schedulerDetailCompositeViewTemplate), itemView: SchedulerDetailItemView, initialize: function () { var Load = Backbone.Model.extend(); var LoadCollection = Backbone.Collection.extend({ model: Load }); // this array of loads, nested within my JSON data, represents // a new collection to be rendered as models using SchedulerDetailItemView var loadList = new LoadCollection(this.model.get("loads")); this.collection = loadList; }, appendHtml: function (collectionView, itemView) { collectionView.$("#schedulerDetailStops").append(itemView.el); } });
设置集合后， appendHtml()将按预期触发，并在此新设置的集合中呈现每个新模型。