4

我正在使用车把和 Backbone 的组合。我有一个“容器”视图，它有一个数组来保存子视图。每当我添加新视图时，都不会绑定单击事件。

我的帖子视图：

Post.View = Backbone.View.extend({
    CommentViews: {},
    events: {
        "click .likePost": "likePost",
        "click .dislikePost": "dislikePost",
        "click .addComment button": "addComment"
    },
    render: function() {
        this.model.set("likeCount", this.model.get("likes").length);
        this.model.set("dislikeCount", this.model.get("dislikes").length);
        this.$('.like-count').html(this.model.get("likeCount") + " likes");
        this.$('.dislike-count').html(this.model.get("dislikeCount") + " dislikes");

        return this;
    }, ...

我在“容器”视图中的回调代码创建了一个新的主干视图，将其附加到车把模板并在页面上显示：

success: _.bind(function(data,status,xhr) {
                        $(this.el).find("#appendedInputButton").val('');
                        var newPost = new Post.Model(data);
                        var newPostView = new Post.View({model: newPost, el: "#wall-post-" + newPost.id});
                        var source = $("#post-template").html();
                        var template = Handlebars.compile(source);

                        var html = template(newPost.toJSON());
                        this.$('#posts').append(html);
                        newPostView.render();
                        this.PostViews[newPost.id] = newPostView;
                    }, this), ...

不知道发生了什么，但是最初运行这种代码是为了设置页面（因为 html 是在服务器端呈现的，所以没有把手）并且所有事件都可以正常工作。如果我重新加载页面，我也可以喜欢/不喜欢帖子。

我错过了什么？

4

2 回答 2

2

我没有看到你附加newPostView.render().el到 dom 。或者我错过了什么？

于 2012-11-02T17:56:07.227 回答
0

假设“#post-template”包含“likePost”按钮。newPostView 永远不会添加到 DOM 中。

将 el 添加到新的 Post.View 使主干搜索 DOM（并且该元素尚不存在） 4 行后将 HTML 字符串添加到 DOM（假设 this.el 已经在 DOM 中）

如果您在 append(html) 之后创建 Post.View ，则可以找到该元素并且将触发事件。
但是自然的 Backbone 方式是在 Post.View 渲染函数中渲染 HTML 字符串，将结果附加到它的 el 并将该 el 附加到 #posts 元素。

success: function (data) {
  var view = new Post.View({model: new Post.Model(data)});
  this.$('#posts').append(view.render().el);
  this.PostViews[data.id] = view;
}
于 2012-11-05T22:15:21.657 回答