Backbone.js - il metodo di recupero non si attiva l'evento di reset

Question

Inizio con Backbone.js e sto provando a creare la mia prima app di esempio - la lista della spesa.

Il mio problema si verifica quando richiamo la raccolta di elementi, probabilmente l'evento di reset non viene attivato, quindi il metodo di rendering non viene chiamato.

Modello:

Item = Backbone.Model.extend({ 
    urlRoot : '/api/items', 
    defaults : { 
    id : null, 
    title : null, 
    quantity : 0, 
    quantityType : null, 
    enabled : true 
    } 
}); 

Collezione: vista

ShoppingList = Backbone.Collection.extend({ 
    model : Item, 
    url : '/api/items' 
}); 

listino:

ShoppingListView = Backbone.View.extend({ 

el : jQuery('#shopping-list'), 

initialize : function() { 
    this.listenTo(this.model, 'reset', this.render); 
}, 

render : function (event) { 
    // console.log('THIS IS NEVER EXECUTED'); 
    var self = this; 
    _.each(this.model.models, function (item) { 
     var itemView = new ShoppingListItemView({ 
      model : item 
     }); 
     jQuery(self.el).append(itemView.render().el); 
    }); 
    return this; 
} 

}); 

Lista voce:

ShoppingListItemView = Backbone.View.extend({ 

tagName : 'li', 

template : _.template(jQuery('#shopping-list-item').html()), // set template for item 

render : function (event) { 
    jQuery(this.el).html(this.template(this.model.toJSON())); 
    return this; 
} 

}); 

Router: iniziare

var AppRouter = Backbone.Router.extend({ 

routes : { 
    '' : 'show' 
}, 

show : function() { 
    this.shoppingList = new ShoppingList(); 
    this.shoppingListView = new ShoppingListView({ 
     model : this.shoppingList 
    }); 
    this.shoppingList.fetch(); // fetch collection from server 
} 

}); 

Applicazione:

var app = new AppRouter(); 
Backbone.history.start(); 

Dopo caricamento della pagina, collezione di oggetti è correttamente scaricati dal server, ma il rendering il metodo di ShoppingListView non viene mai chiamato. Cosa sto facendo di sbagliato?

Answer 1

Ecco il problema:

"Quando i dati del modello ritorna dal server, utilizza impostati (intelligentemente) unire i modelli recuperati, a meno che non si passa {Reset: true}" Backbone Docs

Quindi, si vuole sparare la prendere con l'opzione di ripristino:

this.shoppingList.fetch({reset:true}); // fetch collection from server 

---

per inciso, è possibile definire a collection attribute on a view:

this.shoppingList = new ShoppingList(); 
    this.shoppingListView = new ShoppingListView({ 
    collection : this.shoppingList // instead of model: this.shoppingList 
    }); 

Answer 2

Si utilizza Backbone 1.0? In caso contrario, ignorare questo, altrimenti, è possibile trovare ciò che il doc dice sul metodo Collection#fetch interessante.

Per citare il changelog:

aggiornamento "di Rinominato Collection '' per impostare, per il parallelismo con la model.set simile(), e il contrasto con ripristino E 'ora il meccanismo di aggiornamento di default dopo un'operazione di recupero Se.. vuoi continuare a utilizzare "reset", passare {Reset: true} "

quindi, fondamentalmente, non sei fare un reset qui, ma un update, quindi non reset evento viene generato.