在循环内访问Backbone.js视图上的方法

Question

我正在开发一个包含包含多个ItemView元素的ItemListView的应用程序。 在我的ItemListView ，我使用jQuery .each()方法遍历项目集合并将它们呈现为列表元素。

除了将li元素实际附加到包含的ul之外，我已经准备好了所有内容。 症结在于从我的.each()循环内部访问ItemListView.appendItem方法。 我试过使用this.appendItem和self.appendItem ，但是在循环内部this是item而self是window对象。

这是我现在所拥有的：

ItemListView = Backbone.View.extend({
    el: '#item-rows',
    initialize: function () {
        this.collection = new Items();
        this.render();
    },
    render: function () {
        $.each(this.collection.models, function (i, item) {
            var itemview = new ItemView( { model: item });
            this.appendItem(itemview); // this refers to the item, so appendItem is undefined
        });
    },
    appendItem: function (itemView) {
        $(this.el).append(itemView.render().el);
    }
});

var itemlistview = new ItemListView;

我非常确定上下文问题是唯一的问题，因为我已经通过将其他内容输出到控制台检查了它们的其他部分，并且看起来还不错。

我想念什么？

Answer 1

实现此目标的一种更为Backbone的方法是使用underscore.js提供的collection的each ：

render: function() {
  this.collection.each( function( item, index ) {
    var itemView = new ItemView( { model:item } );
    this.appendItem( itemView );
  }, this );
  return this;
}

笔记：

• 注意each参数的第二个参数，它们将引用绑定到
• each取第一个元素，第二个索引
• render通常应出于链接目的返回this值（如docs中所述），我认为如果没有这一部分，您的appendItem函数将不会按预期工作

Answer 2

是的，这是一个非常简单的修复。 您只需要在外部上下文中参考this 。

render: function () {
    var somereftothis = this;
    $.each(this.collection.models, function (i, item) {
        var itemview = new ItemView( { model: item });
        somereftothis.appendItem(itemview); // this refers to the item, so appendItem is undefined
    });
},