由於屬性造成的主幹分割集合

Question

我的主幹與Slim一起工作，我需要從集合中創建手風琴菜單。 json文件看起來像這樣。由於許多數據，文件僅僅是一個例子，而不是整個數據。每個這些entrys是Moduls，主題。

[{ 
"modulnummer":"7500", 
"semester":"5", 
"liste":"GI", 
"bezeichnung":"2D-Bildanalyse" 
}, 
{"modulnummer":"7720", 
"semester":"5", 
"liste":"GI", 
"bezeichnung":"3D-Animation" 
}, 
{"modulnummer":"7100", 
"semester":"5", 
"liste":"MI", 
"bezeichnung":"3D-Modellierung und Animation" 
}, 
{ 
"modulnummer":"7510", 
"semester":"5", 
"liste":"GI", 
"bezeichnung":"Advanced Networking" 
}, 
{ 
"modulnummer":"2110", 
"semester":"2", 
"liste":"-", 
"bezeichnung":"Algorithmen und Datenstrukturen" 
}, 
{ 
"modulnummer":"1340", 
"semester":"1", 
"liste":"-", 
"bezeichnung":"Analysis" 
}, 
{ 
"modulnummer":"3250", 
"semester":"3", 
"liste":"-", 
"bezeichnung":"Animation" 
}, 
{ 
"modulnummer":"7520", 
"semester":"5", 
"liste":"GI", 
"bezeichnung":"Anwendung der k\u00fcnstlichen Intelligenz" 
}, 
{ 
"modulnummer":"7110", 
"semester":"5", 
"liste":"MI", 
"bezeichnung":"Ausgew\u00e4hlte Kapitel der angewandten Informatik" 
}, 
{ 
"modulnummer":"2120", 
"semester":"2", 
"liste":"-","bezeichnung":"Auszeichnungssprachen" 
}, 
{ 
"modulnummer":"2130", 
"semester":"2", 
"liste":"-", 
"bezeichnung":"Programmieren 2" 
}, 
{ 
"modulnummer":"3110", 
"semester":"5", 
"liste":"MI", 
"bezeichnung":"Automatentheorie und Formale Sprachen" 
}] 

我想有這樣的菜單：

<ul> 
    <li><a href='#'><span>Semester 1,3,5</span></a> 
     <ul> 
     <li><a href='#'><span>Semester 1</span></a> 
      <ul> 
       <li><a href='#'><span>Modul 1</span></a></li> 
       <li><a href='#'><span>Modul 2</span></a></li> 
       <li><a href='#'><span>Modul ...</span></a></li> 
      </ul> 
     </li> 
     <li><a href='#'><span>Semester 3</span></a>...</li> 
     <li><a href='#'><span>Semester 5</span></a>...</li> 
     </ul> 
    </li> 
    <li><a href='#'><span>Semester 2,4,5</span></a> 
     <ul> 
     <li><a href='#'><span>Semester 2</span></a> 
      <ul> 
       <li><a href='#'><span>Modul 1</span></a></li> 
       <li><a href='#'><span>Modul 2</span></a></li> 
       <li><a href='#'><span>Modul ...</span></a></li> 
      </ul> 
     </li> 
     <li><a href='#'><span>Semester 3</span></a>...</li> 
     <li><a href='#'><span>Semester 5</span></a>...</li> 
     </ul> 
    </li> 
    <li><a href='#'><span>Elective Modul</span></a> 
     <ul> 
     <li><a href='#'><span>List G</span></a> 
      <ul> 
       <li><a href='#'><span>Modul 1</span></a></li> 
       <li><a href='#'><span>Modul 2</span></a></li> 
       <li><a href='#'><span>Modul ...</span></a></li> 
      </ul> 
     </li> 
     <li><a href='#'><span>List MI</span></a>...</li> 
     </ul> 
    </li> 
</ul> 

我試圖建立不同的JSON文件，過濾收集和我甚至試圖在解決這個問題的看法渲染。但是我的解決方案沒有工作。 我需要過濾學期1,3,5所以奇數比even（2,4,6），然後用一個聆聽值（GI，MI）一次。我怎樣才能做到這一點不迷路？或者更好的是什麼是最好的方法？過濾集合？爲每個學期實施不同的觀點？我有點迷路了。

我的工作：

window.NavListView = Backbone.View.extend({ 

    tagName : 'ul', 

    render : function(eventName) { 
     _.each(this.model.models, function(modul) { 
      $(this.el).append(new NavListItemView({ 
       model : modul 
      }).render().el); 
     }, this); 
     return this; 
    }, 
    close : function() { 
     $(this.el).unbind(); 
     $(this.el).remove(); 
    } 
}); 

window.NavListItemView = Backbone.View.extend({ 

    tagName : "li", 

    template : _.template($('#tpl-nav-list-item').html()), 

    render : function(eventName) { 
     $(this.el).html(this.template(this.model.toJSON())); 
     return this; 
    }, 

    close : function() { 
     $(this.el).unbind(); 
     $(this.el).remove(); 
    } 
}); 

window.NavView = Backbone.View.extend({ 

    template : _.template($('#nav-item-template').html()), 

    initialize : function() { 
     this.model.bind("change", this.render); 

    }, 

    render : function(eventName) { 
     $(this.el).html(this.template(this.model.toJSON())); 
     return this; 
    }, 
    close : function() { 
     $(this.el).unbind(); 
     $(this.el).empty(); 
    } 
}); 

路由器

routes : { 
      '' : 'home', 
      "*path" : "notFound" 

     }, 
     home : function() { 
      if (!this.navList) { 
       this.navList = new NavCollection(); 
       var self = this; 
       this.navList.fetch({ 
        success : function() { 
         self.navListView = new NavListView({ 
          model : self.navList 
         }); 

         // changeView fuer header schreiben TODO 

         $('header').append(self.navListView.render().el); 
         // console.log(self.navList); 
        } 
       }); 
      }; 
     }, 

和模板

<script type="text/template" id="tpl-nav-list-item"> 
    <a class="pagechange" title="<%- bezeichnung %>" href='#module/<%- modulnummer %>'><%- bezeichnung %></a> 
</script> 

和模型

window.Nav = Backbone.Model.extend({ 
    urlRoot : "../api/menuitems", 


    defaults : { 
     "bezeichnung" : "", 
     "modulnummer" : "", 
     "semester" : "", 
     "liste" : "" 
    }, 
}); 

window.NavCollection = Backbone.Collection.extend({ 
    model : Nav, 
    url : "../api/menuitems", 

}); 

Answer 1

，你可以在客戶端做的是將過濾器添加到您的收藏由奇/偶學期數，像這樣

MyModules = Backbone.Collection.extend({ 
    // other functions ... 
    even: function() { 
     return this.filter(function(modul) { return modul.get('semester') % 2;}); 
    } 
}); 

過濾，然後讓所有甚至你想要的模塊通過

modules = new MyModules(); 
// fetch data from somewhere ... 
modules.even(); 

如果您可以更改json數據結構的服務器端生成，則可以按照需要的方式返回嵌套結構。有一個可以處理嵌套屬性的骨幹擴展DeepModel。