Javascript 主干呈现其他集合元素中的集合

我有一个需要渲染的结构。它有线性类型：

{districts : [
            {
                name : "D17043"                
            },
            {
                name : "D91832"
            },
            {
                name : "D32435"
            }
        ],
buildings : [
            {
                name : "B14745",
                district: "D17043",
                address: "1st str"
            },
            {
                name : "B14746",
                district : "D91832",
                address : "1st str"
            },
            {
                name : "B14747",
                district : "D17043",
                address : "1st str"
            }            
        ]
}

它被简化为看起来更好一点。各区都有附属建筑物。这个结构可能是嵌套的，但我认为这会带来额外的麻烦，而且，由于这个“树”不是结构化的，所以我创建了一个简单的对象。 问题是-如何用主干正确显示它？ 现在看起来是这样的（一些细节被留在了幕后）：

然后，在district collection view中的某个位置，我们创建了一个循环，用于生成单个district的视图：

var districtView = new App.Views.District({model : district});

在单个区域的

视图

中，我在

渲染

方法中调用另一个集合：

App.Views.District = Backbone.View.extend({
        tagName : 'div',
        className : 'districtListElement',
        render : function () {                
            this.$el.html(this.model.get('name'));
            var buildingsCollection = new App.Collections.Buildings(allData.buildings);
            buildingsCollection.each(function(item){
                if (item.get('district') == this.model.get('name')) {
                    var buildingView = new App.Views.Building({model : item});
                    this.$el.append(buildingView.render().el);
                }
            }, this);
            return this;
        }
    });

这东西很管用，但不是有点让人毛骨悚然吗？也许有一个合适的方法可以做到这一点？特别是如果我有其他的例子在建筑物内。

---

谢谢。

最好不要在视图中创建新集合。构造代码，以便在数据可用时创建集合；（子）集合可以是另一个（父）集合的属性。然后，在父视图中，创建一个子视图（将其传递给子集合），并渲染子视图谢谢您，Stephen，我已经分离了新集合的创建，但现在是左线性结构。

App.Views.District = Backbone.View.extend({
        tagName : 'div',
        className : 'districtListElement',
        render : function () {                
            this.$el.html(this.model.get('name'));
            var buildingsCollection = new App.Collections.Buildings(allData.buildings);
            buildingsCollection.each(function(item){
                if (item.get('district') == this.model.get('name')) {
                    var buildingView = new App.Views.Building({model : item});
                    this.$el.append(buildingView.render().el);
                }
            }, this);
            return this;
        }
    });