backbone.js - Marionette CompositeView as itemView of its own itemView (circular recursion?) -
here's interesting one. i've got 2 compositeviews, categoriesview
, categoryview
, i've got nested collection of categories, each category may have 0 or more children. i'd render collection category children uses categoriesview
itemview
, category without uses categoryview
. ideally, i'd have categoryview
use categoriesview
itemview
, , vice versa. so:
+---------------------------------+ | categoriesview: title | <- 4 children |---------------------------------| | categoryview: item 1 | <- 0 children | categoryview: item 2 | <- 0 children | categoryview: item 3 | <- 0 children | +-----------------------------+ | | | categoriesview: title | | <- 10 children | |-----------------------------| | | | categoryview: item 5 | | ...
the issue i'm running can't define categoryview
's itemview
property categoriesview
because object defined later in script file. causes compositeview
use itemview
.
var categoryview = marionette.compositeview.extend({ template: cattpl, tagname: 'li', itemview: categoriesview, itemviewcontainer: '.panel-group', initialize: function() { if (this.model.get('children').length) { this.collection = this.model.get('children'); } }, onrender: function() { if (!this.collection) { this.$(".panel-group").remove(); } } }); var categoriesview = marionette.compositeview.extend({ template: grouptpl, classname: "panel panel-default", itemview: categoryview, itemviewcontainer: '.panel-body ul', initialize: function() { this.collection = this.model.get('children'); } });
(side note: i'm using bootstrap's panel
, collapse
render each category group own panel.)
right now, renders top level categories panels, , underneath lists.
is there better way handle kind of nested view relationship? i'm sure hack if needed, i'd rather "right" way. :) or should forget , go nested list route omitting itemview
on categoryview
uses itself?
this should work:
var categoryview = marionette.compositeview.extend({ // don't define itemview here... }); var categoriesview = marionette.compositeview.extend({ // edited brevity itemview: categoryview, // edited brevity }); categoryview.itemview = categoriesview
Comments
Post a Comment