javascript - How to resolve circular dependencies with nested views in Backbone.js -

javascript - How to resolve circular dependencies with nested views in Backbone.js -

i'm building app using brunch , backbone.js include nested menus. have created menuitemmodel , menuitemscollection, both extending corresponding backbone-base-objects.

in add-on have menuitemview (for individual items) menuitemsview (for collections of items). stripped down, this:

class menuitemview extends backbone.view tagname: 'li' initialize: (options) -> if @model.get('children')? childcollection = new menuitemlist childview = new menuitemsview el: $('<ul>').appendto @el collection: childcollection class exports.menuitemsview extends backbone.view initialize: (options) => @collection.bind 'add', @add add: => view = new menuitemview { model: @collection.last() }

as can see, there's circular dependency between 2 views, , not exclusively unexpectedly, line "childview = new menuitemsview" results in "uncaught referenceerror: menuitemsview not defined" in js-console.

my question whether there way resolve this? can create nested menus through recursive function later in code, doesn't seem neat , self-contained like. in addition, found next 2 instances on sof people suggest using nested views in code above. doing wrong?

http://stackoverflow.com/a/6476507

nesting views within views in backbone js

since you're not using menuitemsview within class definition of menuitemview, there shouldn't problems. seek changing

childview = new menuitemsview

to:

childview = new exports.menuitemsview

it looks set menuitemsview exports namespace, initialize looking class called menuitemsview within own local namespace.

javascript backbone.js coffeescript circular-dependency