Backbone.js視圖中的多個模型

Question

是否可以創建一個視圖，列出綁定到不同模型的集合？也可以使用排序功能？

例如我有'銷售'和'賬戶'模型，並希望使用在這些部門工作的人員的所有姓名進行查看。

謝謝

Answer 1

當然。你通常做的是最終使用在集合上應用事件監聽器的組合，創建代表每個模型的小型子視圖並通過它綁定模型事件處理程序。

BigView = Backbone.View.extend({ 
    el: 'ul', // This view is a <ul> and we'll be adding the model views 
    initialize: function() { 
     // This collection represents the collection you passed in 
     // For our purpose lets say it was a SalesCollection 
     this.collection.on('reset', this.addAllSales, this); 
     this.collection.on('add', this.addSale, this); 
    }, 
    addAllSales: function() { 
     var that = this; 
     this.collection.each(function(sale) { 
      that.addSale(sale); 
     }); 
    } 
    addSale: function(model) { 
     var view = new Subview({ 
      'model': model 
     }); 
     this.$el.append(view.render().el); 
    } 
}); 

SaleView = Backbone.View.extend({ 
    initialize: function() { 
     this.model.on('change', this.something, this); 
    }, 
    render: function() { 
     this.$el.html(); // Or whatever else you need to do to represent a sale as view 
     return this; 
    } 
    something: function(model) { 
     // Code for something 
    } 
}); 

所以在這個例子中，你基本上有你的主視圖有一個集合（例如銷售）。當銷售收款重置時，它會啓動addAllSales()。每次向集合中添加銷售時，我們都會添加一個代表特定模型（銷售模型）的子視圖。在這個子視圖中，我們將綁定事件處理爲模型更改，然後執行某些操作。