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