Backbone JS - this.model.models而不是this.collection?

Han*_*rix 4 backbone.js backbone.js-collections

我是Backbone JS的新手,一直关注Christopher Coenraets Wine Cellar教程.

这一切都很好,花花公子,但我不明白他是如何使用this.model.models访问集合而不是this.collection.此外,当我尝试将代码更改为后者时,似乎this.collection未定义.

window.WineListView = Backbone.View.extend({

    tagName:'ul',

    initialize:function () {
        this.model.bind("reset", this.render, this);
    },

    render:function (eventName) {
        _.each(this.model.models, function (wine) {
            $(this.el).append(new WineListItemView({model:wine}).render().el);
        }, this);
        return this;
    }

});
Run Code Online (Sandbox Code Playgroud)

nik*_*shr 6

两件事让你感到沮丧:

  • 您可以根据需要在视图中注入集合.通常的方法是传递一个集合属性,但在这里它作为模型在路由器中传递:

    this.wineList = new WineCollection();
    this.wineListView = new WineListView({model:this.wineList});
    
    Run Code Online (Sandbox Code Playgroud)
  • collection.models保存集合中的原始模型数组

    models collection.models
    对集合内部JavaScript模型数组的原始访问.通常,您需要使用get,at或Underscore方法来访问模型对象,但有时需要直接引用该数组.

如果要this.collection在视图中使用,则应将路由器修改为

this.wineList = new WineCollection();
this.wineListView = new WineListView({collection: this.wineList});
Run Code Online (Sandbox Code Playgroud)

然后你可以用它作为

window.WineListView = Backbone.View.extend({
    tagName: 'ul',

    initialize: function () {
        this.collection.bind("reset", this.render, this);
    },

    render: function (eventName) {
        // Backbone proxies Underscore methods on collections
        // _.each(this.collection.models, function (wine) {

        this.collection.each(function (wine) {
            $(this.el).append(new WineListItemView({model: wine}).render().el);
        }, this);

        return this;
    }
});
Run Code Online (Sandbox Code Playgroud)