模板没有'在Backbone集合中发生更改后,无法重新发送
Template doesn't rerender after change in Backbone collection
我有一个呈现模板entry
的视图。当a模型被添加到集合movieSeats
时,它执行@collection.on('add', @appendEntry, this)
部分,该部分将模板entry
添加到#entries
容器。
class Movieseat.Views.Entry extends Backbone.View
template: JST['movieseats/entry']
className: 'movie-frame'
initialize: ->
@collection.on('change', @render, this)
@collection.on('add', @appendEntry, this)
@collection.on('destroy', @render, this)
return
render: ->
$(@el).html(@template(entry: @collection))
this
events: ->
"click div":"showCollection"
showCollection: ->
console.log @collection
appendEntry: (entry) ->
view = new Movieseat.Views.Entry(collection: entry)
$('#entries').append(view.render().el)
在另一个视图中,我有一个从集合中删除模型的事件。
class Movieseat.Views.MovieseatsIndex extends Backbone.View
template: JST['movieseats/index']
render: ->
$(@el).html(@template())
this
events: ->
"click li": "addEntry"
"click .remove": "destroyEntry"
addEntry: (e) ->
movie_title = $(e.target).text()
@collection.create title: movie_title
destroyEntry: (e) ->
thisid = @$(e.currentTarget).closest('div').data('id')
@collection.get(thisid).destroy()
这也起作用,影片会从集合中删除,但问题是当我从集合中移除模型时,Entry
视图中的@collection.on('destroy', @render, this)
不会起任何作用。我必须刷新页面才能查看删除事件的结果。
更新
在这两个视图中,我都将console.log (@collection)
添加到div元素上的单击事件中。当我点击一个div时,我会得到这个结果,
Backbone.Model {cid: "c5", attributes: Object, collection: Movieseats, _changing: false, _previousAttributes: Object…}
Movieseats {length: 8, models: Array[8], _byId: Object, _events: Object, constructor: function…}`
第一个结果来自Entry
视图,第二个来自Movieseat
视图。
您是否尝试在集合中侦听remove
事件而不是destroy
?http://backbonejs.org/#Events-目录
在渲染中添加一个快速console.log,以检查哪些事件导致视图重新运行该函数。根据我的经验,我总是在集合上使用reset
、add
、remove
和sort
事件,在单个模型上使用change
、destroy
等等。如果你愿意的话,这对我来说更有意义。集合不会被销毁,但项目会被删除。:)
相关文章:
- Jquery Onclick将数据发送到新打开的窗口
- javascript:发送带有音频文件的POST,然后重定向到新页面
- 使用ajax发送rowID并将选定的行附加到新表中
- MeteorJS:用户集合如何公开新字段
- NodeJS Fork-每次子流程发送新行时都进行React
- 为什么当我使用初始化触发器函数时,我总是找不到脚本函数:发送发票如果新
- 更新购物车.我想发送以前的数量和新数量
- 使用Node中的Q promise库对值数组顺序调用/执行相同的函数;并返回带有结果的新数组/集合
- 如何在发送时不打开新页面的情况下使用php/ajax发送表单
- 在获取后将新模型准备到集合中(不带比较器)
- 发送新信息时向下滚动到底部
- 拖放后将访问者发送到新页面
- 将AngularJS变量发送到新的弹出窗口
- Backbone.Collection 获得第一个 n 作为新集合
- 从javascript向Ashx处理程序发送xml数据,并在新窗口中显示响应
- 链接与创建新集合 - 效率
- 如何将信息发送到新实例化的主干集合
- backbone-js:如何静默初始化一个新的集合
- 从一个已有的集合中创建一个新的集合
- 在Meteor视图中添加了新的集合项目后,如何运行客户端代码