主干collection.each()不起作用

Backbone collection.each() is not working

本文关键字：不起作用 each collection 主干      更新时间：2023-09-26

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

TypeError: Object function(){返回父对象。应用(这个参数);}没有方法'each'。

我正在学习骨干从一些杰弗里方式教程;我输入了与他相同的代码，但由于某种原因，它不起作用。

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

为什么.each()函数有这个问题?我输入了相同的代码，对于Jeffrey来说，它按预期工作，但对于我来说，它显示了这个错误。谢谢你的帮助。

需要初始化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

如果您熟悉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)

您的代码在jsfiddle中运行良好。

http://jsfiddle.net/puleos/kbLES/

var peopleView = new PeopleView ({collection: peopleCollection});
$(document.body).append(peopleView.render().el);

看起来你可能有一个依赖问题。你能张贴你是如何在页面上包括你的脚本吗?

相关文章：