Backbone.js:Collection的"更改"事件未触发

Tho*_*mas 40 javascript backbone.js

我有一个非常简单的集合,但我似乎无法绑定它的变化事件.在Chrome的控制台中,我正在运行:

var c = new AwesomeCollection();
c.bind("change", function(){
  console.log('Collection has changed.');
});

c.add({testModel: "Test"}); // Shouldn't this trigger the above log statement?
Run Code Online (Sandbox Code Playgroud)

由于这是难以追查的事情之一,我怀疑是否有人知道发生了什么事情(如果是这样,很棒!).所以,我问两个问题:

  1. 上述代码应该如预期的那样工作吗?
  2. 如果是这样,你对如何追踪失败的地方有什么建议吗?

谢谢

sol*_*oth 68

change只有在修改其中一个集合的模型时才会触发该事件.将模型添加到集合时,add将触发事件.
请参阅Backbone.js的集合文档:

您可以绑定"更改"事件,以便在修改集合中的任何模型时收到通知,监听"添加"和"删除"事件[...]

要监听何时add发生修改您的代码

var c = new AwesomeCollection();
c.bind("add", function(){
  console.log('Collection has changed.');
});

c.add({testModel: "Test"}); 
Run Code Online (Sandbox Code Playgroud)


tim*_*ham 11

不,这只会引发"添加"事件.如果您这样做,它将引发更改事件:

var c = new AwesomeCollection();
c.bind("change", function() {
  console.log('Collection has changed.');
});

var model = new Backbone.Model({testModel: "Test"});
c.add(model);
model.set({testModel: "ChangedTest"});
Run Code Online (Sandbox Code Playgroud)


Chr*_*row 10

如果您想知道何时对集合进行了重要的事情,那么这些是您可能想要收听的事件: change add remove reset

关于您的示例,这就是您的代码可能如下所示:

var c = new AwesomeCollection();
c.bind('change add remove reset', function(){
    console.log('Collection has changed.');
});
Run Code Online (Sandbox Code Playgroud)


Chi*_*itz 5

在大多数情况下可能没有必要,但您可以手动触发对象/集合上的更改事件:

object.trigger("change");
Run Code Online (Sandbox Code Playgroud)