Verschwindende Modelle in der Rückgratsammlung

Question

Ich habe ein Backbone -Modell line Das enthält eine Sammlung des Modells Stop. Irgendwann möchte ich durch die Stopps in der Linie iterieren und die gesamte Reisezeit entlang der Linie mit der Unterstrichfunktion erhalten reduce.

Dies funktioniert jedoch nicht. Es scheint, dass irgendwann mit der Sammlung etwas passiert. Es scheint nur ein Objekt ohne aussagekräftige Attribute zu enthalten, obwohl ich dafür weiß, dass es mit vier Stopmodellen mit gültigen Attributen bevölkert wurde.

Das Model:

App.models.Line = Backbone.Model.extend({
    initialize: function() {
        var stops = new App.models.Stops({
            model: App.models.Stop,
            id: this.get("id")
        });
        stops.fetch();
        this.set({
            stops: stops
        });
        this.set({unique: true});
        this.calculateTotalTime();
    },
    calculateTotalTime: function() {
        this.get("stops").each(function(num) {
            console.log("Model!");
        });
        console.log("Unique: ", this.get("unique"));
    }
});

Konsolenausdruck ist:

Model!
Unique:  true

Es sollte vier "Modell!" Geben, da die Anzahl der Modelle vier beträgt.

Das Seltsamste ist, dass alles in der Konsole gut funktioniert:

window.line.get("stops").each(function(num) {
            console.log("Model!");
        });
Model!
Model!
Model!
Model!

Das JS wird mit Kettenrädern zusammengestellt:

//= require ./init

//= require ./lib/jquery
//= require ./lib/underscore
//= require ./lib/backbone
//= require ./lib/raphael

//= require_tree ./controllers
//= require_tree ./models
//= require_tree ./views

//= require ./main

init.js:

window.App = {};
App.views = [];
App.models = [];

main.js:

$(function() {
  window.line = new App.models.Line({name: "4", id: 4});
  window.lineView = new App.views.Line({model: line});
  $("#outer").append(lineView.render().el);
});

Ein anderes seltsames Verhalten:

console.log(this.get("stops")) Im Modell liefert dieses ziemlich normale Objekt:

child
  _byCid: Object
  _byId: Object
  _onModelEvent: function () { [native code] }
  _removeReference: function () { [native code] }
  id: 4
  length: 4
  models: Array[4]
    0: Backbone.Model
    1: Backbone.Model
    2: Backbone.Model
    3: Backbone.Model
  length: 4
  __proto__: Array[0]
  __proto__: ctor

Aber rufen console.log(this.get("stops").models), was das Array ergeben sollte, gibt nur dieses zurück, ein Array eines einzelnen Objekts ohne nützliche Attribute:

[
  Backbone.Model
  _callbacks: Object
  _changed: false
  _changing: false
  _escapedAttributes: Object
  _previousAttributes: Object
  attributes: Object
    id: 4
    model: function (){ return parent.apply(this, arguments); }
    __proto__: Object
    cid: "c1"
    id: 4
  __proto__: Object
]

Ich vermute, dass dies alles auf ein Missverständnis über die Natur von zurückzuführen ist this. Ich bin froh, dass jede Hilfe angeboten wird.

Answer 1

stops.fetch() ist ein asynchroner Prozess, daher ist der Code, den Sie direkt nach dem Schreiben geschrieben haben, wahrscheinlich vor den Ergebnissen des Abrufs aus dem Server zurückgekommen.

Sie müssen Ihren Code ändern, um alles auszuführen, nachdem der Abruf zurückgekommen ist. Der einfachste Weg, dies zu tun, ist mit dem reset Ereignis aus dem stops Sammlung:

App.models.Line = Backbone.Model.extend({
    initialize: function() {
        var stops = new App.models.Stops({
            model: App.models.Stop,
            id: this.get("id")
        });


        // store the stops, and then bind to the event
        this.set({stops: stops});
        stops.bind("reset", this.stopsLoaded, this);
        stops.fetch();

    },

    stopsLoaded: function(){
        // get the stops, now that the collection has been populated
        var stops = this.get("stops");
        this.set({unique: true});
        this.calculateTotalTime();
    },

    calculateTotalTime: function() {
        this.get("stops").each(function(num) {
            console.log("Model!");
        });
        console.log("Unique: ", this.get("unique"));
    }
});

Der Grund, warum es in Ihrer Konsole funktioniert fetch Call hat die Sammlung bereits zurückgegeben und besiedelt.

Ich hoffe, das hilft