2

尽管在 StackOverflow 和其他地方有很多关于同一主题的问题/答案，但我仍然不明白如何继续。我想更改我的收藏以在我的视图中触发渲染功能。View 有一个集合，而不是一个模型——所以我看到的许多 model.bind 示例都不适用。显然 collection.bind 不是合法的绑定。这是我的视图代码。我应该在初始化中添加什么，以便在orderedPrefs（集合）发生更改时调用视图的渲染函数？

headerView = Backbone.View.extend({

        el: $('#' + targetdiv),
        collection: orderedPrefs,
        events: {
            "click .scheduleheader": "clicked"                               // dependency here on scheduler.js class naming .scheduleheader

        },
        initialize: function () {
            _.bindAll(this, "render");

        },
        render: function () {
            alert('render!!');
        },

…………

4

2 回答 2

3

这些应该在初始化函数中工作：

this.collection.on("add", this.render);
this.collection.on("remove", this.render);
this.collection.on("reset", this.render);

如果他们不这样做，则附加到视图的集合有问题。您不应该使用全局“orderedPrefs”。

骨干文档状态：

创建新视图时，您传递的选项作为 this.options 附加到视图，以供将来参考。有几个特殊选项，如果通过，将直接附加到视图：模型、集合、el、id、className、tagName 和属性。

实例化视图时，您需要像这样传递集合：

new headerView({ collection: orderedPrefs });

如果你想跟踪集合模型的变化，你应该在不同的视图中进行：

var ModelView = Backbone.View.extend({
    initialize: function() {
        _.bindAll(this, "render");
        this.render();
        this.model.on("change",this.render);
    },
    render: function() {
        $(this.el).html("model view markup"); // you should use templating
        return this;
    }
});

var headerView = Backbone.View.extend({
    el: $('#' + targetdiv),
    initialize: function () {
        _.bindAll(this, "render");
        this.collection.on("add", this.render);
        this.collection.on("remove", this.render);
        this.collection.on("reset", this.render);
    },
    render: function () {
        var self = this;
        this.collection.each(function(collectionModel){
            var view = new ModelView({ model : collectionModel });
            $(self.el).append(view.el);
        });
    }
});
于 2012-10-24T07:26:27.780 回答
1

您可以使用绑定collection.on到“添加”和“删除”事件。有关使用示例，请参阅添加下的文档。

this.collection.on("add", this.render);

如果您使用的是 Backbone 0.9.0 或更高版本，则可以在同一语句中绑定多个事件：

this.collection.on("add remove", this.render);

还要注意“bind”应该和“on”一样工作：

为了清楚起见，bind 和 unbind 已重命名为 on 和 off，遵循 jQuery 的领导。旧名称也仍受支持。

于 2012-10-23T22:46:18.907 回答