backbone.js中的Underscore.js模板在tr周围添加div

Question

我正在使用来自backbone.js的underscore.js的模板功能,我有以下模板,我在我的页面中定义如下:

<script type="text/template" id="businessunit_template">
  <tr data-uid="{{Uid}}">
    <td class="first"><span>{{Name}}</span></td>
    <td class="{{StatusClass}} tac">{{OverallScore}}%</td>
    <td>
        <a class="impactanalysis individualBu" href="#"> </a>
    </td>
  </tr>
</script>

我将trs附加到下表的tbody元素:

<table class="listing">
  <thead>
    <tr>          
      <th class="first">Business Units</th>
      <th>BCMS<br />Status</th>
      <th>View</th>
    </tr>
  </thead>
  <tbody id="reportBusinessUnits"></tbody>
</table>

我呈现tr的个人骨干视图如下所示:

class ReportBusinessUnitView extends MIBaseView
  initialize: (options) ->
    @vent = options.vent
    @template = _.template($('#businessunit_template').html())

  events:
    "click .individualBu": "showBusinessUnitDetail"

  showBusinessUnitDetail: (e) =>
    e.preventDefault()    
    self = @   

    @vent.trigger('management:showbusinessunitdeail', @model)

  render: =>
    $(@el).html(@template(@model.toJSON()))
    @

问题是,渲染的输出在tr周围有一个div,我不知道它来自哪里:

<div>
  <tr data-uid="a5e3c218-1ca4-4806-b27e-24a25ed83ab6">
    <td class="first"><span>Central Networks</span></td>
    <td class="red tac">4%</td>
    <td>
        <a class="impactanalysis individualBu" href="#"> </a>
    </td>
  </tr>
</div>

我只是看不出我做错了什么.有谁知道这可能来自哪里？

Answer 1

这看起来非常类似于在未正确声明.el属性时获得的错误DOM片段View.我将断点/ debugger语句放入其中ReportBusinessUnitView.render()并this.el从那里检查属性的值.(View.el docs).

另外,检查您的代码:

• 你申报了.el财产吗？(MIBaseView例如)
• 它是否击中了正确的DOM节点？

如果没有,Backbone自动DIV为您创建节点,这可能会令人困惑.