模型中的主干嵌套集合监听添加答案

【问题标题】：backbone nested collections in model listening for add模型中的主干嵌套集合监听添加
【发布时间】：2014-08-28 09:43:54
【问题描述】：

我有一个模型，其中包含集合。在我的网络应用程序中，我有一个项目模型，其中我有一个名为“collaborators”的属性，该属性实际上是用户的集合。

在我的视图的初始化中，我有以下内容，

this.model.get('collaborators').on( 'change', alert("!!"), this);

当视图首次加载时，我会收到一个警报，在视图中我有一个事件，它会触发以下事件，

var newModel = new app.User({ id: this.clickedElement.data('userId') });
                console.log(this.model.get(this.formSection)); // shows that the collection has 4 models
                newModel.fetch({
                    success: function() {

                        that.model.get(that.formSection).add(newModel);
                        console.log(that.model.get(that.formSection)); //shows that the collection has 5 models

                    }

                });

正如您在上面的代码中看到的那样，我正在记录我的合作者集合，它显示长度为 4，在成功方法中获取之后，我是否将刚刚获取的模型添加到该集合中，然后记录再次收集，这次返回长度为 5。

这对我来说意味着添加成功，那么“添加”的事件监听器在初始页面查看后没有触发吗？

【问题讨论】：

我没有看到add 听众。只有change - 但这是在您的合作者收藏中。集合不会触发 change 事件，我不确定它是否会冒泡到父模型。
即使我这样做 `this.model.get('collaborators').on('add', alert("!!"), this);'它仍然只在视图的初始加载时触发，而不是在我向集合中添加更多数据时触发。
您是否尝试过仅在父模型上使用change 事件？
是的 this.listenTo('this.model', 'change', alert("!!")); 完全一样

标签： javascript backbone.js backbone-views backbone.js-collections

【解决方案1】：

问题是你应该传递一些函数作为on 方法的第二个参数。但是您在事件绑定时刻触发alert 并传递alert 的结果而不是函数。这应该可以正常工作：

this.model.get('collaborators').on('change', function(){
    alert("!!");
});

更新：但是你应该明确你想要捕捉哪些事件。您可以通过在backbone.js 文件中搜索trigger 方法调用来查找在获取（或任何其他过程）期间触发的所有事件。

更新：您还可以使用此代码来捕获所有触发的事件：

collaborators.on('all', function(){
    /**
     * `arguments` object contains all of arguments passed to the function.
     * @see http://backbonejs.org/#Events-on for more details about `all`
     * catching.
     */
    console.log(arguments); 
});

【讨论】：

【解决方案2】：

当你绑定到协作者的 change 事件时，你应该使用 Backbone 的 listenTo 事件。

this.listenTo(this.model.get('collaborators'), "change", function(){alert("!!"), this);

http://backbonejs.org/#Events-listenTo

使用 this.listenTo 的好处是当视图关闭/移除时，Backbone 会自动调用 this.stopListening 导致您的视图自动解除绑定事件。这将帮助您清理事件并防止幻像。

http://backbonejs.org/#Events-stopListening

【讨论】：