0

我在视图中包含基于集合的附加模型时遇到问题。我有一个由父视图创建的评论列表。它需要我在呈现评论以显示删除按钮并突出显示他自己的评论时具有当前用户名。现在的问题是我无法在 CommentListView 中访问模型会话，因此初始化中的 this.session 或来自 addAllCommentTo list 之类的方法的调用是未定义的。我在这里做错了什么？我认为很容易从模型中将另一个对象添加到视图设备中。

评论列表视图：

window.CommentListView = Backbone.View.extend({

    el: $("#comments"),

    initialize: function () {

        this.model.bind('reset', this.addAllCommentToList, this);
        this.model.bind('add', this.refresh, this);
        this.model.bind('remove', this.refresh, this);
    },

    refresh: function(){
        this.model.fetch();
    },

    addCommentToList : function(comment) {
        console.log("comment added to dom");
        //need to check why el reference is not working
        $("#comments").append(new CommentView({model:comment, sessionModel: this.session}).render().el);
    },

    addAllCommentToList: function() {
        $("#comments").empty();
        this.model.each(this.addCommentToList);
    }
});

在初始化方法中从父列表调用：

window.UserDetailView = Backbone.View.extend({

    events: {
        "click #newComment" : "newComment"
    },

    initialize: function () {
        this.commentText = $("#commentText", this.el);

        new CommentListView({ model: this.model.comments, session: this.model.session });


        new LikeView({ model: this.model.like });

        this.model.comments.fetch();

    },

    newComment : function() {

        console.log("new comment");
        this.model.comments.create(
            new Comment({text: this.commentText.val()}), {wait: true}
        );
        this.commentText.val('');
    }

});

模型：

window.UserDetail = Backbone.Model.extend({

    urlRoot:'/api/details',

    initialize:function () {
        this.comments = new Comments();
        this.comments.url = "/api/details/" + this.id + "/comments";

        this.like = new Like();
        this.like.url = "/api/details/" + this.id + "/likes";

        this.session = new Session();

    },

    ...
});
4

1 回答 1

2

我看到一个问题，但还有其他问题吗？

您正在像这样初始化视图：

new CommentListView({ model: this.model.comments, session: this.model.session });

而且您期望在您的视图中有这样的参考this.session。

这不会发生。您发送到 View 构造函数的所有哈希都将存储到this.optionsBackbone View 构造函数文档中：

创建新视图时，您传递的选项作为 this.options 附加到视图，以供将来参考。

所以你可以开始改变这一行：

$("#comments").append(new CommentView({model:comment, sessionModel: this.session}).render().el);

通过这个：

$("#comments").append(new CommentView({model:comment, sessionModel: this.options.session}).render().el);

试着告诉我们。

更新

还要更改此行：

this.model.each(this.addCommentToList);

这样：

this.model.each(this.addCommentToList, this);

第二个参数是context，换句话说：你想this在被调用的handler中成为什么。

于 2012-08-13T19:41:41.807 回答