骨干视图将模板分配给el

bot*_*bot 1 javascript coffeescript backbone.js

是否可以将@template()分配给@el,如下所示:

someview.js.coffee

class SomeView extends Backbone.View
  template: JST["app/templates/sometemplate"]

  events:
    'click' : 'onClick'

  initialize: ->

  render: ->
    @el = @template()

  onClick: ->
    #do something
Run Code Online (Sandbox Code Playgroud)

index.js.coffee

class IndexView extends Backbone.View
  initialize: ->
    @collection.on('reset', @render, this)

  render: ->
    $(@el).html('')
    for m in @collection.models
      view = new App.Views.SomeView(model: m)
      $(@el).append(view.render().el)
Run Code Online (Sandbox Code Playgroud)

sometemplate.jst.hamlc

.someview_template
  .stuff_inside
Run Code Online (Sandbox Code Playgroud)

我所处的情况,SomeView类被div包裹,它让我失去了我想直接在'.someview_template'元素上分配的点击事件.我能想到解决这个问题的方法是重新设置@el = @template()......是可能的还是正确的方法呢?

是这样的情况,Backbone.View的@el应该始终是包含div,模板应该只是该div中包含的元素?如果将@el自动设置为@template()中找到的根节点,它似乎会更基本.我应该让sometemplate.jst.hamlc只包含".stuff_inside",然后在SomeView中设置$(@ el).addClass('someview_template'),这样我可以确定事件是否分配给该元素?

谢谢!

mu *_*ort 5

不,这不是因为几个原因:

  1. 您将丢失事件绑定,@el因此您的所有事件都不会起作用.
  2. 缓存@$el将不再匹配@el.

如果要替换@el,请使用@setElement:

setElement view.setElement(element)

如果您想将Backbone视图应用于不同的DOM元素,请使用setElement,它还将创建缓存的$el引用,并将视图的委托事件从旧元素移动到新元素.

你可能想要更像这样的东西:

render: ->
  @setElement(@template())
  @
Run Code Online (Sandbox Code Playgroud)