Marionette CompositeView attachHtml после, а не append

Question

У меня есть модель с дочерними отношениями родителя и родителями, которые я хотел бы отображать в таблице, отображать каждого родителя, за которым следуют дети, где я немного отступят от детей. Я почти там, но я могу только добавить дочерние элементы в родительскую строку, а не добавлять их после родительской строки.

View.TreeView = Backbone.Marionette.CompositeView.extend({ 
    template: listItemTpl, 
    tagName: "tr", 
    initialize: function() { 
    var children = new Backbone.Collection(this.model.get('children')); 
    if (this.model.get('parent')) { 
     this.$el.addClass('child'); 
    } else { 
     this.$el.addClass('parent'); 
    } 
    this.collection = children; 
    }, 

    attachHtml: function(collectionView, childView, index) { 
    collectionView.$el.append(childView.el); 
    } 
}); 

View.TreeRoot = Backbone.Marionette.CompositeView.extend({ 
    tagName: "table", 
    className: "table table-bordered table-striped", 
    childView: View.TreeView, 
    template: listTpl, 
    childViewContainer: "tbody" 
}); 

Я попытался

collectionView.$el.after(childView.el); 

, но это не работает.

Мой родительский родитель модели создан на стороне сервера, используя sailsjs, как показано ниже.

module.exports = { 
    schema: true, 
    attributes: { 
    name: 'string', 
    category: { 
     model: 'Category' 
    }, 
    parent: { 
     model: 'Term' 
    }, 
    children: { 
     collection: 'Term', 
     via: 'parent' 
    } 
    } 
}; 

Answer 1

У меня была эта аналогичная проблема, и я закончил тем самым использование нескольких таблиц. Помещение родительского объекта в thead и детей в tbody.

Так подсказка, если вы хотите идти по этому пути:

Используйте compositeView с его моделью является родительским объектом, сбор детей, и это шаблон быть ваш стол. Отобразите ваши данные модели внутри раздела thead, сделайте childViewContainer телом и используйте tr как tagName.

(Спасибо JSteunou @ GitHub)

List.Child = App.Views.ItemView.extend({ 
    template: "urltotemplate", 
    tagName: 'tr' 
}); 

List.Parent = App.Views.CompositeView.extend({ 
    template: "urltotemplate", 
    tagName: 'table', 
    childView: List.Child, 
    childViewContainer: 'tbody', 

    initialize: function(options){ 
    this.collection = this.model.get("children"); 
    } 
}); 

List.Parents = App.Views.CompositeView.extend({ 
    template: "urltotemplate", 
    childView: List.Parent, 
    childViewContainer: 'div.container' 

});