Магистральная коллекция полна данных, но модели пустые

Question

С Backbone.js, я пытаюсь загрузить мои данные в коллекцию. Мой bootstrap выглядит как log.reset(<JSON>);

Когда я console.log моей коллекции, я вижу кучу объектов, полных данных. Проблема заключается в том, когда я console.log на отдельных моделях в цикле, я вижу кучу пустых объектов без данных. Все данные содержатся в коллекции, но я не могу заставить ее перейти в мой шаблон на каждом проходе forEach. Я использовал ту же структуру кода в другой части моего проекта, чтобы визуализировать представление коллекции, которое отлично работает ... Я не знаю, почему этот не работает.

Обратите внимание, что я слушаю событие сброса в коллекции.

//Log Model 
var LogItem = Backbone.Model.extend({}); 

var logItem = new LogItem(); 


//Log Collection 
var Log = Backbone.Collection.extend({ 
    model: LogItem 
}); 

var log = new Log(); 


//Log Item View 
var LogItemView = Backbone.View.extend({ 
    tagName: 'tr', 
    template: _.template($('#log-item-template').html()), 
    render: function(){ 
     var attributes = this.model.toJSON(); 
     this.$el.html(this.template(attributes)); 
     console.log(this.model.toJSON()); //This shows a bunch of empty objects 
     return this; 
    } 
}); 


//Log View 
var LogView = Backbone.View.extend({ 
    el: '#log', 
    initialize: function() { 
     this.collection.on('reset', this.render, this); 
    }, 
    render: function(){ 
     this.addAll(); 
     console.log(this.collection.toJSON()); //This shows objects full of data 
    }, 
    addOne: function(food) { 
     var logItemView = new LogItemView({model: logItem}); 
     this.$el.append(logItemView.render().el); 
    }, 
    addAll: function() { 
     this.$el.html(''); 
     this.collection.forEach(this.addOne, this); 
    } 
}); 

var logView = new LogView({collection: log}); 

Как исправить мои пустые модели?

Answer 1

При создании вашего подвидов, ваш метод addOne объявляет food аргумент, но вы называете LogItemView конструктор с {model: logItem}

Попробуйте

addOne: function(food) { 
    var logItemView = new LogItemView({model: food}); 
    this.$el.append(logItemView.render().el); 
}