2013-03-03 4 views
0

Я не понимаю, почему DOM не обновляется в целях сбора визуализации:Как визуализировать представления элементов для коллекции, включая добавление нового представления?

 
class FastTodo.Views.TodoItemsIndex extends Backbone.View 

    template: JST['todo_items/index'] 

    el: '#main' 

    render: -> 
    $(@el).html @form_view.render() 
    @collection.each @renderOne 

    renderOne: (item) -> 
    console.log(@) 
    console.log(@el) 
    $(@el).append "model data" 

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

Идея заключается в том, что #main сначала получить вид с добавить новую форму, а затем сбор добавляется к #main ,

Как мне это сделать?

Выход зрения в консоли выглядит следующим образом: populated collection is not rendered

ответ

1

1) Для @collection.each @renderOne Для корректной работы Вам необходимо связать свой метод renderOne к экземпляру вида, как это: renderOne: (item) => (обратите внимание на жирную стрелку), потому что в противном случае она вызывается в глобальном контексте (именно поэтому вы видите эти Window объектов в консоли.

2) DOM элемент, а не сам вид, должно быть вставлен в DOM, так $(@el).html @form_view.render() должен быть записан в виде @$el.html @form_view.render().el (render метод должен возвращать экземпляр представления acco rding для сообщества сообщества).

Другое выглядит прекрасно и должно работать таким образом.

Возможно, вы захотите обратиться к некоторым сообщениям о контексте в js для более глубокого понимания предмета (например, this one).

btw Вы можете написать меньше кода для некоторых вещей. т.е. это

@collection.bind 'reset', => 
    @render() 
@collection.on 'add', (item) => 
    @renderOne(item) 

может стать этим

@collection.on 'reset', @render 
@collection.on 'add', @renderOne 

, но вы должны помнить, чтобы связать ваш метод render с жировой стрелкой в ​​этом случае.

+0

спасибо! контекстные привязки с coffeescript намного понятнее – poseid

Смежные вопросы