Backbone collection.each()不起作用

bes*_*uti 2 javascript backbone.js

当我尝试使用Backbone的collection.each()方法时,我收到以下消息:

TypeError:Object function(){return parent.apply(this,arguments); 没有方法'每个'.

我正在从一些Jeffrey Way教程中学习Backbone; 我为他输入了相同的代码,但由于某种原因它不起作用.

var Person = Backbone.Model.extend({
    defaults: {
        name: 'besim dauti',
        age: 15,
        occupation: 'web developer'
    }
});

var PeopleView = Backbone.View.extend({
    tagName: 'ul',

    render: function(){
        this.collection.each(function(person) {
            var personView = new PersonView({ model: person });
            this.$el.append(personView.render().el)
        }, this)
        return this;
    }
});

var PersonView = Backbone.View.extend({
    tagName: 'li',

    template: _.template( $('#personTemplate').html() ),

    render: function(){
        this.$el.html(this.template(this.model.toJSON()) );
        return this;
    }
});

var PeopleCollection = Backbone.Collection.extend({
    model: Person
});

var peopleCollection = new PeopleCollection([
    {
        name: 'besim',
        age: 25,
        occupation: 'web developer'
    },
    {
        name: 'gaurav',
        age: 25,
        occupation: 'web designer'
    },
    {
        name: 'jeffry',
        age: 27
    }
])

var peopleView = new PeopleView ({collection: PeopleCollection});
$(document.body).append(peopleView.render().el);
Run Code Online (Sandbox Code Playgroud)

为什么这个.each()功能存在这个问题?我输入相同的代码,对于Jeffrey,它按预期工作,但对我来说它显示了这个错误.我感谢您的帮助.

Geo*_*ith 5

你需要初始化PeopleCollection.

看到: var peopleView = new PeopleView ({collection: PeopleCollection});

您传入的是原始构造函数,而不是它的实例.

你应该做这个:

var peopleCollection = new PeopleCollection(); // Create an instance of PeopleCollection
var peopleView = new PeopleView ({collection: peopleCollection}); // Pass it to peopleView
Run Code Online (Sandbox Code Playgroud)

如果您熟悉OOP(面向对象编程),则将其PeopleCollection视为类和该类var peopleCollection = new PeopleCollection()的实例.您必须使用实例.

您也会在内部遇到错误,.each因为您已大写person.改成:

this.collection.each(function(person) {
   var personView = new PersonView({ model: person });
   this.$el.append(personView.render().el)
}, this)
Run Code Online (Sandbox Code Playgroud)