Заселение Магистраль с несколькими коллекциями

Question

Я новичок в Backbone.

Я ищу шаблон дизайна, который работает для моей ситуации.

В настоящее время у меня есть вид шаблон, который состоит из несколько HTML выберите:

<select id="s1"></select> 
<select id="s2"></select> 
<select id="s3"></select> 
.... 

И собираюсь заселить select с несколько Collections Backbone, с другим путем API JAX-RS.

var C1 = Backbone.Collection.extend({ 
    url='/path1' 
}); 

var C2 = Backbone.Collection.extend({ 
    url='/path2' 
}); 

... 

прямо вперед способ, чтобы иметь решение, как this:

render: function(){ 
    var that = this, promises = [], 
     c1 = new C1(), c2 = new C2(), c3 = new C3(); 

    promises.push(c1.fetch()); 
    promises.push(c2.fetch()); 
    promises.push(c3.fetch()); 
    ... 

    $.when.apply(null, promises).done(function(){ 
     that.$el.html(FormTemplate({c1m: c1.models, c2m: c2.models, c3m: c3.models, ...})); 
    }); 

    return this; 
} 

Однако это будет включать несколько вызовов API от клиента к серверу Java. Есть ли способ достичь этого, используя только 1 вызов API?

Спасибо.

Answer 1

Очевидно, что API должен предоставить один маршрут, который возвращает все данные. Затем вы можете получить его, используя единую коллекцию, и передать отфильтрованные данные в другие коллекции, не прибегая к вызовам API.

Что-то вроде:

var SingleEndPointCollection = Backbone.Collection.extend({ 
    url = '/singleEndPoint' 
}); 

var C1 = Backbone.Collection.extend({}); 

var C2 = Backbone.Collection.extend({}); 

var C3 = Backbone.Collection.extend({}); 

var view = Backbone.View.extend({ 
    initialize: function() { 
    var that = this; 
    this.collection = new SingleEndPointCollection(); 
    this.collection.fetch({ 
     success: function(collection, response) { 
     that.c1 = new C1(collection.filter(function() { 
      // your logic here 
     })); 
     that.c2 = new C2(collection.filter(function() { 
      // your logic here 
     })); 
     that.c3 = new C3(collection.filter(function() { 
      // your logic here 
     })); 
     that.render(); 
     } 
    }); 
    }, 
    render: function() { 
    var that = this; 
    that.$el.html(FormTemplate({ 
     c1m: that.c1.toJSON(), 
     c2m: that.c2.toJSON(), 
     c3m: that.c3.toJSON() 
    })); 
    return this; 
    } 
});