如何使用Backbone和CoffeeScript將新項目呈現給集合？

我有一個小表單來添加一個項目，以及一個列出所有項目的集合視圖。不過，我沒有看到，這裏的/如何調用呈現一個新項目：如何使用Backbone和CoffeeScript將新項目呈現給集合？

表單視圖：

 
class FastTodo.Views.AddTodoItem extends Backbone.View 

    template: JST['todo_items/add_item'] 

    el: '#main' 

    events: 
    'submit': 'addItem' 

    addItem: (event) -> 
    event.preventDefault() 
    @collection.create task: $('#task').val() 

    render: -> 
    $(@el).html @template() 

    initialize: -> 
    @collection = new FastTodo.Collections.TodoItems() 
    @render()

集合視圖：

 

class FastTodo.Views.TodoItemsIndex extends Backbone.View 

    template: JST['todo_items/index'] 

    render: -> 
    console.log("render") 

    renderOne: (item) -> 
    console.log(item) 

    initialize: -> 
    @collection = new FastTodo.Collections.TodoItems() 
    @collection.bind 'reset', => 
     @render() 
    @collection.on 'add', (item) => 
     console.log('addd') 
     @renderOne(item) 
    @collection.fetch()

我希望在控制檯輸出顯示一個新項目。但是，我看到：

console output add new backbone view

如何呈現在收集新的項目？（或者顯示renderOne被觸發？）

來源

2013-03-03 poseid

你在哪裏創建'AddTodoItem'視圖？當您嘗試使用它創建新的待辦事項時，您未在創建時向其傳遞集合，導致出現「未定義」錯誤。 – neebz 2013-03-03 11:44:44

這確實是我的問題，我想在路由器級別創建所有視圖。任何其他選項可以將集合綁定到多個視圖，而不必將集合從一個視圖傳遞到另一個視圖？ – poseid 2013-03-03 12:52:27

你應該有一個全局的應用程序變量，基本上初始化所有的東西，路由器，視圖，模型等（如傳統語言中的主要功能）你可以將集合附加到該全局變量，並讓視圖從那裏訪問它。說這不是一個好策略。如果你的應用程序想要訪問一個集合，它應該直接或通過父視圖傳遞給它，如果有的話。 – neebz 2013-03-03 17:09:58

您的AddTodoItem和您的TodoItemsIndex需要共享同一個集合的實例。這是骨幹的設計。所以你的路由器應該創建一個集合的實例，並將它傳遞給選項對象給這兩個視圖的構造函數。然後事件將正常流動，並且視圖將保持同步。爲了解決您的評論，不要將集合從一個視圖傳遞到另一個視圖，應該通過共享模型/集合和路由器級別的代碼處理單獨視圖的接線。

你也可以爲你的應用程序和一個共享集合提供一個全局命名空間，就像in the TodoMVC examples project here一樣，但是我個人更喜歡獨立模塊來依賴於共享全局變量。

另一種考慮的方法是mediator pattern as described here，儘管我認爲共享集合在你的情況下更簡單和完全足夠。

來源

2013-03-03 17:10:50

如何使用Backbone和CoffeeScript將新項目呈現給集合？

回答

相關問題