所以我有两种看法。 绑定到集合的一个“父”视图和绑定到集合中的各个模型的多个子视图。

class ResultTable extends Backbone.View
    el:"body"
    initialize:()->
       @collection.bind "add", @add

    add:(model)->
       new ModelView({model:model})

class ModelView extends Backbone.View
    el: "#resultsTableList"
    initialize:()=>
       @model.on "selected",@select
       @render()

    render:()=>
       #append template 

    select:(e)=>
       e.preventDefault()
       console.log(@model)

    events:
       'click' : 'select'

因此,当我单击列表元素之一时,将触发所有ModelViews的select函数。 我以为我将仅显示已单击的特定模型的构建方式。 这是怎么回事?

模板HTML-

<div id="resultsTableContainer" class="resultsContainer">
    <ul id="resultsTableList">
    </ul>

这是针对每个模型的

<li class="result">
{{ ipAddress }}


  </li>

===============>>#1 票数:3 已采纳

您所有的ModelView都绑定到相同的DOM元素:

class ModelView extends Backbone.View
    el: "#resultsTableList"

然后,每个实例将绑定到#resultsTableList点击:

events:
   'click' : 'select'

需要注意的是,指定一个事件events没有选择将其绑定到视图的el

省略selector会使事件绑定到视图的根元素( this.el )。

结果是您有多个视图绑定到完全相同的DOM元素上的点击。

我认为您想从ModelView中删除el并让Backbone这样构建<li>

class ModelView extends Backbone.View
    tagName: 'li'
    className: 'result'
    #...

然后,用于ModelViewel将是<li class="result"> ,并且点击处理程序将附加到<li> 您还必须调整渲染,以将el放入调用方的<ul id="resultsTableList">中。

===============>>#2 票数:1

我答应会在一个答案中解释我的评论,虽然亩太短才是正确的答案,但希望它对您也很有价值

我的意思是,在绑定时,我宁愿使用listenTo而不是on (以避免僵尸侦听器),但是如果您确实使用on确保在需要时传递上下文,例如

this.model.on("selected", this.select);

VS

this.model.on("selected", this.select, this);

第一个将this对象绑定到model ,第二个在您调用它时将其绑定到this (视图)

因此,这全都取决于您希望this对象在select函数主体中位于什么位置

(抱歉,它不在CoffeeScript中,我只是不太了解)

  ask by praks5432 translate from so

未解决问题?本站智能推荐: