Backbone.js的收集事件 [英] backbone.js collection events

问题描述

我开发一个jQuery和放大器; Backbone.js的Web应用程序。结果
一个组件有一个HTML表，这张表的背后，是一个集Backbone.js的。结果
这个集合中的任何变化应导致HTML表的更新，所以我写

I develop a jquery & backbone.js web app.
One component has an html table and behind this table is a backbone.js collection.
Any change in this collection should lead to an update of the html table, so I write

this.collection.bind("reset add remove", this.renderRows, this);    

所以我更新HTML表，当整个收集得到新的，当一个新的模式被添加，当一个模型被删除。

So I update the html table, when the whole collection gets new, when a new model gets added and when a model gets removed.

有也被调用的详细视图组件，当用户徘徊和点击在HTML表的某一行。在这部分的开始，我得到正确的模式从集合中

There's also a detail view component that gets called when the user hovers and clicks over a certain row of the html table. At the beginning of this component I get the right model out of the collection

changeModel = this.collection.get(id);

用户已经改变了一些属性后，我

After the user has changed some attributes, I do

changeModel.set(attrs); 

和返回的HTML表格。集合中的模型具有正确的改变值。

and return to the html table. The model in the collection has the correct changed values.

但HTML表格不更新没有3事件（复位，添加，删除）被触发的。

But the html table is not updated as none of the 3 events (reset, add, remove) was triggered.

所以我添加替换到集合结合

So I added "replace" to the collection binding

this.collection.bind("replace reset add remove", this.renderRows, this);

和从我所谓的细节视图返回前

and before returning from the detail view I called

this.collection.trigger("replace");

我的解决方案的工作，但我的问题是：

My solution works, but my question is:

有没有本地Backbone.js的解决方案已经存在，而且我错过了和在那里我不必由我自己来触发的东西吗？

Is there any "native" backbone.js solution that is already there and that I have missed and where I do not have to trigger something by myself?

推荐答案

从模型泡沫的更改事件到集合。 （在集合的 _onModelEvent - 函数注明出处该方法基本上只是需要从模型中的所有事件，触发他们的集合。

The change events from models bubble up to the collection. (Collection's _onModelEvent -function in the annotated source. The method just basically takes all events from models and triggers them on the collection.

这导致

1. 模型属性设置


2. 型号触发器更改


3. 收藏渔获量更改


4. 收藏触发器更改

1. Model attribute is set
2. Model triggers change
3. Collection catches change
4. Collection triggers change

所以

this.collection.bind("replace reset add remove", this.renderRows, this); 

已经用这个来代替

has to be replaced with this

this.collection.bind("change reset add remove", this.renderRows, this);

希望这有助于！

P.S。

我个人的看法是，如果只有一个模式被改变，你不应该重绘整个表。相反，使每表行中本身就是一个观点，即有对应型号为模型，然后反应有属性更改。有一个在重绘500表格单元格，如果你只是一个目标是没有意义的。

My personal opinion is that you shouldn't redraw the whole table if just one model is changed. Instead make each table row a view in itself that has the corresponding model as its model and then react to attribute changes there. There is no point in redrawing 500 table cells if you're targeting just one.

更新

和现在你应该在 -method使用绑定事件。

And nowadays you should use the on -method for binding to events.

collection.on("change reset add remove", this.renderRows, this);

如果您在使用BB 1.0，并且该事件正在内的查看，我建议迁移到使用新的 listenTo 绑定到事件，这也可以很容易地解除绑定调用视图时。删除（）。在这种情况下，你应该做的：

If you're using BB 1.0, and this event is being listened to within a View, I suggest moving to use the new listenTo to bind into events, which also allows for easy unbinding when calling view.remove(). In that case you should do:

// assuming this is the view
this.listenTo(collection, "change reset add remove", this.renderRows);

这篇关于Backbone.js的收集事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！