Backbone.js: Zdarzenie "zmiana" kolekcji nie uruchamia się

Question

Mam dość prostą kolekcję, ale nie mogę wiązać się ze zdarzeniem zmiany. W konsoli Chrome, biegnę:

var c = new AwesomeCollection(); 
c.bind("change", function(){ 
    console.log('Collection has changed.'); 
}); 

c.add({testModel: "Test"}); // Shouldn't this trigger the above log statement? 

Ponieważ jest to jedna z tych rzeczy, które mogą być trudne do wyśledzenia, wątpię, ktoś wie od szczytu głowy, co się dzieje (a jeśli tak, to świetnie!). Tak, zadaję dwa pytania:

1. Czy powyższy kod działa zgodnie z oczekiwaniami?
2. Jeśli tak, czy masz jakieś sugestie, jak wyśledzić, gdzie to się nie powiedzie?

Dzięki

Answer 1

Impreza change jest zwolniony tylko wtedy, gdy jeden z modeli zbiorach są modyfikowane. Po dodaniu modelu do kolekcji zostaje wywołane zdarzenie add.
See backbone.js' Collection Documentation:

Można związać «Change» Zdarzenia być powiadomiony, gdy każdy model w kolekcji został zmodyfikowany, słuchać na «dodaj» i «usuń» wydarzenia [. ..]

aby usłyszeć, gdy add występuje zmodyfikować kod, aby być

var c = new AwesomeCollection(); 
c.bind("add", function(){ 
    console.log('Collection has changed.'); 
}); 

c.add({testModel: "Test"}); 

Answer 2

mam nadzieję AwesomeCollection jest powrót boneCollection.

var AwesomeCollection = new Backbone.Collection(); 

AwesomeCollection.bind('add', function() { 
    console.log('new object in the collection'); 
}); 

AwesomeCollection.add({something}); 

To powinno wystrzelić twoje wydarzenie. Jeśli nie, to jest jeszcze jeden problem gdzie indziej.

Edytuj: zmiana nie może zostać wystrzelona podczas dodawania wydarzenia, tak jak mówili inni.

Answer 3

Nie, to tylko podnosi wydarzenie "dodaj". Podniesie to wydarzenie zmienić, jeśli to zrobić:

var c = new AwesomeCollection(); 
c.bind("change", function() { 
    console.log('Collection has changed.'); 
}); 

var model = new Backbone.Model({testModel: "Test"}); 
c.add(model); 
model.set({testModel: "ChangedTest"}); 

Answer 4

Ponadto, nie możemy powiedzieć, ze swoim przykładzie, ale kolekcja musi mieć właściwość modelu określona, ​​jeśli chcesz dodać modele do niego po prostu przekazując obiekt. W przeciwnym razie musisz przekazać instancję modelu, aby dodać().

Answer 5

Napotkałem ten sam problem co Twój na szkielecie 0.5.3.

Patrząc na Backbone.Collection.reset() realizacja (który nazywa się po fetch(), jeśli nie przewidują żadnych "add" opcjonalną właściwość), linia 503 do 511:

// When you have more items than you want to add or remove individually, 
// you can reset the entire set with a new list of models, without firing 
// any `added` or `removed` events. Fires `reset` when finished. 
reset : function(models, options) { 
    models || (models = []); 
    options || (options = {}); 
    this.each(this._removeReference); 
    this._reset(); 
    this.add(models, {silent: true}); 
    if (!options.silent) this.trigger('reset', this, options); 
    return this; 
}, 

2 rzeczy są tutaj ważne:

this.add(models, {silent: true}); 

co oznacza, że ​​nie zostanie uruchomione żadne zdarzenie "dodaj".

Druga sprawa to:

if (!options.silent) this.trigger('reset', this, options); 

To znaczy, że jeśli zastąpić kod z:

var c = new AwesomeCollection(); 
c.bind("reset", function(){ 
    console.log('Collection has changed.'); 
} 

c.add({testModel: "Test"}); // Shouldn't this trigger the above log statement? 

Powinien działać (pracował dla mnie)

Answer 6

To może nie być konieczne w większość przypadków, ale możesz ręcznie wywołać zdarzenie zmiany na obiekcie/kolekcji:

object.trigger("change"); 

Answer 7

Nie uważam, że jest to dokumentacja nigdzie poza "wszystkimi" zdarzeniami w przypadku wszystkich działań, w tym dodawania, usuwania i zmieniania.

var c = new AwesomeCollection(); 
c.bind("all", function(){ 
    console.log('Something happened'); 
}); 

c.add({testModel: "Test"}); 

Answer 8

Jeśli chcesz wiedzieć, kiedy coś znaczenie zostało zrobione z kolekcji, są to wydarzenia prawdopodobnie chcesz słuchać: change add remove reset

waszym przykładzie jest to, co Twój kod może wyglądać następująco:

var c = new AwesomeCollection(); 
c.bind('change add remove reset', function(){ 
    console.log('Collection has changed.'); 
});