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中，以执行您需要在其他视图上执行的所有操作。