卓別林沒有上下文後模板重新提交

我想有一個可以互換模板的視圖。因此，點擊其中一個複選框可重新顯示視圖。這實際上正在發生。但在視圖重新渲染並正確顯示新模板之後，我將丟失上下文，並且綁定到此視圖的所有點擊都不再起作用。 http://pastebin.com/bFJ5Yuer 卓別林沒有上下文後模板重新提交

View = require 'views/base/view' 
template = require 'views/templates/list_view_a' 

module.exports = class OfferListView extends View 
autoRender: true 
container: "[data-role='content']" 
containerMethod: 'html' 
    initialize: -> 
    super 
    @template = template 
    #views 
    @delegate 'change', '#list_view_a', @change_list_view 
    @delegate 'change', '#list_view_b', @change_list_view 
    @delegate 'change', '#list_view_c', @change_list_view 
    @delegate 'click', @click_ev 

change_list_view: (event) => 
    console.log('change') 
    @template = require 'views/templates/' + event.target.id 
    @render() 

click_ev: => 
    console.log('click') 

getTemplateData: => 
    @collection.toJSON()

任何指針？

來源

2013-02-05 zzart

是的，在change_list_view中調用@render會清除initialize方法中事件綁定的元素。

如果您必須重新渲染視圖（例如，如果您要更改模板），那麼只需在change_list_view的@render調用下面添加@delegateEvents調用即可。

UPDATE

如果你想切換到一個子視圖的方法，你很可能擺脫第二個電話來呈現的。類似這樣的：

# snipped all the outer require js stuff 

class InnerViewBase extends Chaplin.View # Or whatever your base view is 
    autoRender: true 
    container: "#innerViewContainer" 
    containerMethod: "html" 

    initialize: (templateName) -> 
    @template = require templateName 

    super 

class ListViewA extends InnerViewBase 
    initialize: -> 
    super "views/templates/list_view_a" 

    # Do any event handlers in here, instead of the outer view 
    # @delegate 'click', @click_ev 

class ListViewB extends InnerViewBase 
    initialize: -> 
    super "views/templates/list_view_b" 

class ListViewC extends InnerViewBase 
    initialize: -> 
    super "views/templates/list_view_b" 

class OfferListView extends View 
    autoRender: true 
    container: "[data-role='content']" 
    containerMethod: 'html' 

    initialize: -> 
    super 
    @template = template 

    #views 
    # Consider changing these three id subscriptions to a class 
    @delegate 'change', '#list_view_a', @change_list_view 
    @delegate 'change', '#list_view_b', @change_list_view 
    @delegate 'change', '#list_view_c', @change_list_view 
    @delegate 'click', @click_ev 

    afterRender: -> 
    # Add a default ListView here if you want 
    # @subview "ListView", new ListViewA 

    change_list_view: (event) => 
    console.log('change') 

    # Make a hacky looking map to the subview constructors 
    viewNames = 
     "list_view_a": ListViewA 
     "list_view_b": ListViewB 
     "list_view_c": ListViewC 

    @subview "ListView", new viewNames[event.target.id] 

    click_ev: => 
    console.log('click') 

    getTemplateData: => 
    @collection.toJSON()

來源

2013-02-05 17:46:07 Jacob

對@delegateEvents的調用沒有成功。但是，謝謝你指出我正確的方向。這也很有幫助。 Backbone: event lost in re-render

腦海我錯了壓痕

View = require 'views/base/view' 
template = require 'views/templates/list_view_a' 

module.exports = class OfferListView extends View 
autoRender: true 
container: "[data-role='content']" 
containerMethod: 'html' 
template: template 
initialize: (options) -> 
    super   
    #views 
change_list_view: (event) => 
    @template = require 'views/templates/' + event.target.id 
    @render() 

initEvents: => 
    @delegate 'change', '#list_view_a', @change_list_view 
    @delegate 'change', '#list_view_b', @change_list_view 
    @delegate 'change', '#list_view_c', @change_list_view 
    @delegate 'click', @click_ev 
click_ev: -> 
    console.log('click') 
render: => 
    super 

afterRender: => 
    super 
    @initEvents()

來源

2013-02-05 18:29:57 zzart

卓別林沒有上下文後模板重新提交

回答

相關問題