木偶中的嵌套复合视图

Question

在处理不同视图的木偶时，是否可以让一个复合视图调用另一个复合视图调用项视图？例如，结构可以是对象列表，每个对象都有一个属性列表：

ObjectList = Marionette.CompositeView.extend({
    template: "#objectlist-template",
    childView: Object,
    initialize: function(){
    }
});

Object = Marionette.CompositeView.extend({
    template: "#object-template",
    childView: Attribute
    initialize: function(){
    }
});

Attribute = Marionette.ItemView.extend({
    template: "#attribute-template",
});

我在我的项目中尝试过这样做，但似乎不起作用：

var objectListView = new ObjectList({
   collection: objects
});

对象集合应该如何构造？

Answer 1

这是完全可能的，但您需要一些额外的接线。我认为，通常认为最好的做法不是让一个集合中的模型具有另一个集合的属性。我不完全了解您的用例，因此我将假设您的属性只是一个字符串数组，而不是更复杂的东西。

您还应该避免使用变量名，如对象，属性，等等，因为它们与保留字冲突/非常接近。我重命名了示例中的视图。

因此，在您的ItemView中，您需要使用模型的属性创建集合：

var ItemListView = Marionette.CompositeView.extend({
    template  : "#objectlist-template",
    childView : ItemView
});

var ItemView = Marionette.CompositeView.extend({
    template   : "#object-template",
    childView  : ItemAttributeView
    initialize : function(){
        // Assuming 'itemAttributes' is something like ['red','yellow','green']
        var itemAttributes = this.model.get('itemAttributes');

        // Map itemAttributes to be objects to instantiate models
        // `name` can then be used in the attribute's template
        itemAttributes = _.map(itemAttributes, function(ia){ return { name : ia }; });

        // use this array to set the collection for this compositeview
        this.collection = new Backbone.Collection( itemAttributes );
    }
});

var ItemAttributeView = Marionette.ItemView.extend({
    template: "#attribute-template",
});