2012-01-05 2 views
5

Итак, у меня есть вид, который выглядит так.Backbone.js: Как заставить просмотр автоматически обновляться при смене коллекции моделей?

//base class 
    var SelectListView = Backbone.View.extend({ 
     initialize: function() { 
      _.bindAll(this, 'addOne', 'addAll'); 
      this.collection.bind('reset', this.addAll); 
     }, 
     addAll: function() { 
      this.collection.each(this.addOne); 
     }, 
     events: { 
      "change": "changedSelected" 
     }, 
     changedSelected: function() { 
      this.selected = $(this.el); 
      this.setSelectedId($(this.el).val()); 
     } 

    }); 

    //my extended view 
    var PricingSelectListView = SelectListView.extend({ 
     addOne: function(item) { 
      $(this.el).append(new PricingView({ model: item }).render().el); 
     }   
    }); 

Я инстанцирован мнение, как это ...

var products = new ProductPricings(); 
var pricingsView = new PricingSelectListView({ 
    el: $("#sel-product"), 
    collection: products 
}); 

Где-то еще (другой вид пользовательский метод) Я обновил коллекцию Просмотреть цены на

в
pricingsView.collection = new ProductPricings(filtered); 

Это не видел делать что-либо.

pricingsView.render(); 

Итак, теперь коллекция содержит меньше предметов, но новый вид никогда не отображается или не обновляется в DOM.

Как сделать I 1.) обновить рендеринг в DOM? 2.) Автоматически обновить DOM? Должен ли я как-то рассказывать об этом, когда когда-либо меняется коллекция?

ответ

4

Вы связали addOne() с событием reset. Когда вы просто заменяете экземпляр pricingsView.collection, это событие не запускается, и addOne() не выполняется.

Попробуйте вместо этого:

pricingsView.collection.reset(filtered); 
3

Это может работать, так как вы связываете к событию сброса коллекции уже:

pricingsView.collection.reset(filtered); 

http://backbonejs.org/#Collection-reset

Вы еще подправить логику рендеринга, чтобы удалить старую разметку из вида, когда сброс происходит.

+0

Спасибо. Лампочка включена! – ctrlShiftBryan