Rückgrat Sammlung Hinzufügen Ereignis Auslösen, Sobald

Ich habe eine Backbone-Sammlung und wenn ich ein neues Modell, um es den "hinzufügen" - event scheint nicht zu funktionieren wie ich es erwarten würde. Ich habe bound 2 Ansichten zu hören, für das hinzufügen von Ereignissen auf der Sammlung, aber nur eine scheint zu bekommen Kenntnis von dem Ereignis, und wenn dies geschieht, STELLEN keine Anfrage an meinen server. Wenn ich entfernen Sie die zweite Bindung, die anderen Werken-und die PUT-Anforderung gesendet wird. Hier ist der code-Schnipsel:

    var FlagList = Backbone.Collection.extend({
    model: Flag  //model not shown here... let me know if it would help to see
});

    var FlagCollectionView = Backbone.View.extend({
    el: $('ul.#flags'),
    initialize: function() {
        flags.bind('add', this.addFlag, this);  //this one doesn't fire!!
    },
    addFlag: function(flag) {
        alert("got it 1");  //I never see this popup
    }
});

    var AddFlagView = Backbone.View.extend({
    el: $("#addFlagPopup"),
    events: {
        "click #addFlag": "addFlag"
    },
            initialize: function() {
                    flags.bind('add', this.closePopup, this);   //this one fires!!
            }
    addFlag: function() {
        flags.create(new Flag);
    },
    closePopup: function() {
        alert("got it 2");  //I see this popup
    }
});

var flags = new FlagList;
var addFlagView = new AddFlagView;
var flagCollectionView = new FlagCollectionView;

Ist dies die tatsächliche Reihenfolge der Ausführung? sprich: funktioniert das event von 'auf #addFlag' geschickt bekommen, bevor Sie Sie initialisieren die flagCollectionView? Es ist wichtig, dass Sie binden Ereignisse zu modellieren und die Sammlung, bevor Sie erwarten, dass das Ereignis auslösen

InformationsquelleAutor threejeez | 2012-05-14

backbone-events backbone.js

Dieser code funktioniert bei mir:

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

var FlagCollectionView = Backbone.View.extend({
  initialize: function() {
    flags.bind('add', this.addFlag, this); 
  },
  addFlag: function(flag) {
      alert("got it 1");
  }
});

var AddFlagView = Backbone.View.extend({
  initialize: function() {
    flags.bind('add', this.closePopup, this);
  },
  closePopup: function() {
    alert("got it 2");
  }
});

var flags = new FlagList;
var addFlagView = new AddFlagView;
var flagCollectionView = new FlagCollectionView;

flags.add({key:"value"});

überprüfen Sie die jsFiddle

Dein problem ist woanders.

Sie hatten Recht. Eine Ausnahme an anderer Stelle in meinem code verursacht die Skripte, die Ausführung zu stoppen. Danke, dass du für mich immer auf der Spur!

InformationsquelleAutor fguillen

6

Ein paar Vorschläge:

ID vs-Klassen

haben Sie über Ihre qualifizierte Selektor durch die Kombination von einer Klasse und einer id. jQuery ermöglicht, aber der ID-Selektor sollte eindeutig sein, auf der Seite sowieso so ändern el: $('ul.#flags') zu el: $('ul#flags').

Nutzung Backbone

Möchte ich ausdrücklich meinen Sammlungen und/oder Modelle, um meine Ansichten und verwenden Sie die Magie collection und model Attribute views.
```
var flags = new FlagList;
var addFlagView = new AddFlagView({collection: flags});
var flagCollectionView = new FlagCollectionView({collection: flags});
```
das bedeutet nun, dass in Ihrem Blick, werden Sie automatisch Zugriff auf diese.Sammlung

unverbindlich Ereignisse zu vermeiden, ghost Ansichten
```
var FlagCollectionView = Backbone.View.extend(
{
    initialize: function (options)
    {
        this.collection.bind('add', this.addFlag, this);
    },
    addFlag: function (flag)
    {
        alert("got it 1");
    },
    destroyMethod: function()
    {
        //you need some logic to call this function, this is not a default Backbone implementation
        this.collection.unbind('add', this.addFlag);
    }
});

var AddFlagView = Backbone.View.extend(
{
    initialize: function ()
    {
        this.collection.bind('add', this.closePopup, this);
    },
    closePopup: function ()
    {
        alert("got it 2");
    },
    destroyMethod: function()
    {
        //you need some logic to call this function, this is not a default Backbone implementation
        this.collection.unbind('add', this.closePopup);
    }
});
```
Wie es aussieht muss ich Zustimmen, @fguillen, dass dein problem irgendwo sein müssen, wie Sie bei der Initialisierung der view, wie in meinem Kommentar habe ich schon erwähnt, dass es wahrscheinlich im Zusammenhang mit timing, sprich: Bindung Ihrer Veranstaltung, um die Sammlung nach der " add " - Ereignis bereits ausgelöst.
- Sehr schöne Erklärung, ich war zu kämpfen, bevor Sie mit so etwas wie ghost Ansichten: stackoverflow.com/questions/10429648/...
- Sehr hilfreich ist. Ich habe die änderungen, die Sie vorgeschlagen. Danke! Durch die Möglichkeit, über die id ' s ist nicht das gleiche gilt von den ul#flags? Wenn die id 'flags' ist eindeutig auf die Seite (was es ist), ich nehme an, alles was ich brauche, ist el: $('#flags')... richtig?
InformationsquelleAutor Vincent Briglia
1

Wenn du hier gelandet, nachdem Sie die gleichen dummen Fehler, den ich machte, sicherzustellen, dass Sie haben:
```
this.collection.bind( 'add', this.render )
```
und NICHT:
```
this.collection.bind( 'add', this.render() )
```
InformationsquelleAutor sirch

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.