Collection添加事件觸發兩個獨立的集合

通過添加一些額外的功能來了解backbone.js（Todos App）框架的內部，我的Todos App在兩個集合，原始TodoList和我自己的觸發器上觸發collection.add事件UnsavedListCollection添加事件觸發兩個獨立的集合

這是我做過什麼：

添加一個「馬克完成」按鈕來記錄槽_.template，檢查所有選中的複選框，而不更改保存到服務器。

將'Save（{unsaved collection length}）'按鈕添加到文檔槽_.template。

要做到這一點，我跟蹤所有型號的「savedState」的TodoList的

// inside TodoList 
hasUnsaved: function() { 
    return this.filter(function(todo) { 
    var isEqual = _.isEqual(todo.savedAttributes, todo.attributes); 
    return !isEqual; 
    }) 
},

聲明和實例UnsavedList：

// inside window 
window.UnsavedList = Backbone.Collection.extend({ 

    model: Todo, 

    initialize: function() { 
     this.bind('add', this.addHandler) 
    }, 

    addHandler: function() { 
     alert('added') 
    } 
}); 

window.UnsavedTodos = new UnsavedList;

作爲原始樣品中，添加事件勢必要增加一個Handler。

// inside AppView 
... 
initialize: function() { 
    Todos.bind('add', this.addOne); 
    ... 
}

偵聽到 '馬克完成' 按鈕點擊調用markAllDone這反過來又觸發 '的變化：allDone'：

// inside AppView 
markAllDone: function() { 
    Todos.each(function(todo) { 
     todo.set({ done: true }); 
    }) 
    Todos.trigger('change:allDone'); 

},

...和 '變化：allDone' 所調用：

// inside AppView 
checkSaved: function() { 
    this.$('#todo-controls #button-saved').html(this.buttonSavedTemplate({ 
     saved: function() { 
      var list = Todos.hasUnsaved(); 
      _.each(list, function(todo) { 
       UnsavedTodos.add(todo); 
      }) 
      return list.length; 
     } 
    })); 
},

如果你看看我的模板對象的迭代器，我將所有未保存的模型添加到我的UnsavedList中。但奇怪的是，TodoList還監聽這個確切的「添加」事件，所有未保存的模型都顯示在頁面上。

爲什麼這麼說，即使很難我只是'添加'到UnsavedList。

想法？

來源

2011-06-01 bartcc

即使我可能一直生活在一個十沉默：真正}選項，我太好奇這個行爲，並想出我自己找的源代碼：

每次模型被添加到收藏，模型本身觸發添加事件。而在我的情況下，兩個，在TodoList的以及UnsavedList正在聽「添加」

下面是Backbone.js的剪斷代碼：

// inside _add 
if (!options.silent) model.trigger('add', model, this, options);

步行解決這個（想我要保持我的事件流動），我只存儲模型的克隆副本是這樣的：

UnsavedTodos.add(_.clone(todo), { silent: false });

我敢肯定，它更容易這一點使用嵌套集合或任何處理相同的模型，而不是克隆來完成，我設法保持跟蹤我的未保存（克隆）模型通過事件觸發每個ti我在保存，創建或銷燬之後。

This is my completed modified Todos App

來源

2011-06-02 15:47:20 bartcc

Collection添加事件觸發兩個獨立的集合

回答

相關問題