Backbone Kollektion holt die Daten, aber nicht die Modelle

Ich versuche zu füllen mein Rückgrat Sammlung von einer lokalen API und ändern Sie die Ansicht zum anzeigen der Daten. Die fetch () - Aufruf in meiner Sammlung scheint zu gelingen, und packt die Daten, aber die fetch-operation nicht aktualisieren, die Modelle in der Sammlung.

Dies ist, was ich habe für mein Modell und collection:

var Book = Backbone.Model.extend();

var BookList = Backbone.Collection.extend({

    model: Book,
    url: 'http://local5/api/books',

    initialize: function(){
        this.fetch({
            success: this.fetchSuccess,
            error: this.fetchError
        });
    },

    fetchSuccess: function (collection, response) {
        console.log('Collection fetch success', response);
        console.log('Collection models: ', this.models);
    },

    fetchError: function (collection, response) {
        throw new Error("Books fetch error");
    }

});

und ich habe meine Ansichten wie diese:

var BookView = Backbone.View.extend({

    tagname: 'li',

    initialize: function(){
        _.bindAll(this, 'render');
        this.model.bind('change', this.render);
    },

    render: function(){
        this.$el.html(this.model.get('author') + ': ' + this.model.get('title'));
        return this;
    }

});

var BookListView = Backbone.View.extend({

    el: $('body'),

    initialize: function(){
        _.bindAll(this, 'render');

        this.collection = new BookList();
        this.collection.bind('reset', this.render)
        this.collection.fetch();

        this.render();
    },

    render: function(){
        console.log('BookListView.render()');
        var self = this;
        this.$el.append('<ul></ul>');
        _(this.collection.models).each(function(item){
            console.log('model: ', item)
            self.appendItem(item);
        }, this);
    }

});

var listView = new BookListView();

und meine API gibt JSON-Daten wie diese:

[
    {
        "id": "1",
        "title": "Ice Station Zebra",
        "author": "Alistair MacLaine"
    },
    {
        "id": "2",
        "title": "The Spy Who Came In From The Cold",
        "author": "John le Carré"
    }
]

Wenn ich diesen code ausführen bekomme ich diese in der Konsole:

BookListView.render() app.js:67
Collection fetch success Array[5]
Collection models:  undefined 

das zeigt mir, dass die fetch-Aufruf wird immer die Daten OK ist, aber es ist nicht das Auffüllen der Modelle. Kann mir jemand sagen was ich falsch mache hier?

InformationsquelleAutor And Finally | 2013-10-20

Schreibe einen Kommentar