Search code examples
javascriptbackbone.jsunderscore.jsmarionette

Marionette - combining CollectionView with View


I'm new to marionette and I would like to generate CollectionView inside a CollectionView. I read that if a view gets collection as argument it stores it as 'items' argunemt. My problem boils down to this:

const { View, CollectionView } = Marionette; 

const collection = new Backbone.Collection([
    {name: 'Marionette.js'}, {name: 'Backbone.js'}
]);

const MyView = View.extend({
    el: 'body',
  template: _.template(`
  <ul>
    <% _.each(items, function(item) { %>
    <li><%- item.name %></li>
    <% }) %>
  </ul>
  `)
});

const MyCollectionView = CollectionView.extend({
    childView: MyView
})


const myCollectionView = new MyCollectionView([{collection: collection}]);
myCollectionView.render();

But it does not work. Can you guys help me out ?


Solution

  • I found out the answer! It needs only to add

    childViewOptions(model) {
        return {collection: model.get('collection')};
    },
    

    into MyCollectionView and change ...(items,... to be named collection and it does exactly what I wanted.