Modelos que desaparecen en la colección de columna vertebral

Question

Tengo un modelo de columna vertebral line que contiene una colección del modelo Stop. En algún momento, quiero iterar a través de las paradas en la línea y obtener el tiempo de viaje total a lo largo de la línea, utilizando la función de subrayamiento reduce.

Sin embargo, esto no funciona. Parece que algo sucede con la colección en algún momento. Parece contener solo un objeto sin atributos significativos, aunque sé con certeza que se ha poblado con cuatro modelos de parada con atributos válidos.

El modelo:

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"));
    }
});

La impresión de la consola es:

Model!
Unique:  true

Debe haber cuatro "modelo!", Dado que el número de modelos es cuatro.

Lo más extraño es que todo funciona bien en la consola:

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

El JS está compilado con Spockets:

//= 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);
});

Algún otro comportamiento extraño:

console.log(this.get("stops")) En el modelo produce este objeto bastante normal:

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

Pero llamando console.log(this.get("stops").models), que debería producir la matriz, devuelve solo esto, una matriz de un solo objeto sin atributos útiles:

[
  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
]

Sospecho que todo esto se debe a algún malentendido sobre la naturaleza de this. Agradecido por cualquier ayuda brindada.

Answer 1

stops.fetch() es un proceso asincrónico, por lo que el código que ha escrito justo después de que probablemente disparará antes de que los resultados de la búsqueda hayan regresado del servidor.

Deberá modificar su código para ejecutar todo después de que regrese la búsqueda. La forma más fácil de hacer esto es con el reset evento del stops recopilación:

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"));
    }
});

La razón por la que funciona en su consola es porque para el momento en que escribe el código para evaluar las paradas del modelo, el fetch Call ya ha devuelto y poblado de la colección.

Espero que ayude