Backbone.js-一個視圖有多個模型

Question

我有一個模板，該模板需要從兩個不同的API端點（URL）接收數據： cart和user 。

我希望兩個端點充當一個模型或集合，以便我可以執行.changedAttributes()或sync或fetch 。

我知道Backbone非常寬容，但我真的迷路了。

---

操場：

我已經創建了一個Codepen來查看到目前為止我所做的事情： http ://codepen.io/anything/pen/AXoBoa

---

所需的結果應類似於：

initialize: function(){
  var self = this;
  collection.fetch({
  success: function(data){
      self.collection = data;
    }
  })
},

render: function(){
    var self = this;
    var source = $("#template").html();
    var template = Handlebars.compile(source);
    var htmlToRender = template(self.collection.toJSON());
}  

Answer 1

您可以創建一個事件集中器來監聽其注冊對象，然后重新觸發捕獲的事件。

就像是

var aggregate = _.extend({}, Backbone.Events);
aggregate.register = function(m) {
    var self = this;

    this.listenTo(m, 'all', function() {
        this.trigger.apply(this, arguments);
    });
};

然后，您將像這樣使用它

aggregate.on('change', function(m) {
    // do what you have to do when one of the models change
    console.log('Change on ', m.toJSON());
});
aggregate.on('sync', function(m) {
    //same thing for syncs
    console.log('sync ', m.toJSON());
});

var m1 = new Backbone.Model({id: 1});
var m2 = new Backbone.Model({id: 2});
aggregate.register(m1);
aggregate.register(m2);

m1.fetch();
m2.set({data: 2});

和演示http://jsfiddle.net/nikoshr/hm0xc79z/

Answer 2

基於http://backbonejs.org/#Events的 nikoshr的方法略有不同。 基本思想是設置一個可以在兩個視圖中引用的事件對象。 您可以根據需要命名事件，事件可以在對象可用的任何地方觸發和監聽。

1. 創建事件對象。 在您的情況下，將其添加到主appshell對象中。

    appShell.Events = _.extend({}, Backbone.Events); 

2. 當用戶在用戶視圖中執行操作（例如注銷）時，觸發事件。

    appShell.Events.trigger('user:logout'); 

3. 在另一個視圖中收聽事件，然后根據事件執行操作。

    this.listenTo(appShell.Events, 'user:logout', this.doSomething); 

4. 將邏輯放在doSomething中，以執行您需要在其他視圖上執行的所有操作。