I＆QUOT如何;冒泡＆QUOT;嵌套骨干藏品事件？ [英] How can I "bubble up" events on nested Backbone collections?

问题描述

我有一个使用的嵌套集的骨干应用（至少这就是我认为他们是所谓的）。

I have a Backbone app that uses nested collections (at least that's how I think they're called).

在我的具体情况还有的标签和子标签页，每个选项卡（模型）包含子选项卡（型号）的集合。

In my particular case there are tabs and subtabs, and each tab (model) contains a collection of subtab (model).

对于那些谁是更熟悉code，我会写我的吼叫模型和收藏品，和子选项卡是如何嵌套的标签模型中：

For those who're more familiar with code, I'll write bellow my models and collections, and how subtabs are nested inside the tab model:

// Subtab Model
var Subtab = Backbone.Model.extend({
    defaults: { label: undefined }
});

// Subtabs Collection
var Subtabs = Backbone.Collection.extend({
    model: Subtab
});

// Tab Model
var Tab = Backbone.Model.extend({
    defaults: { label: undefined, subtabs: new Subtabs}
});

// Tabs Collection
var Tabs = Backbone.Collection.extend({
    model: Tab
});

现在，当我改变一个标签的属性，它触发的设置页模型，也是对标签集合（很正常的，对吧？），但是当我改变一子选项卡的属性，它触发对子选项卡模式改变事件和子选项卡集合（这也是正常的）的但不能上升到设置页模型（以及在标签集合）。

Now, when I change a tab's attribute it fires the change event on the Tab model and also on the Tabs collection (quite normal, right?), but when I change a subtab's attribute, it fires the change event on the Subtab model and Subtabs collection (this is also normal) but it doesn't bubble up to the Tab model (and to the Tabs collection).

至少，我猜应该因为一个模型中的集合被改变，因此该模型被改变（但也许我错了，我没有得到它）​​。

At least, I guess it should because a collection inside a model was changed and so the model was changed (but maybe I'm wrong and I'm not getting it).

我如何能实现与骨干？这种行为任何建议

推荐答案

A 更改事件是由骨干当通过属性的变化设置触发。该事件随后也引发了收藏，你都看到了。但是，你的子标签页属性的值是不会改变的话，那还是你在默认创建的同一个对象 。如果你使用 tab.set（子选项卡，新的子选项卡）; ，你会得到一个的变化：子标签页事件，但你并不想这样做。

A change event is triggered by Backbone when an attribute changes via set. The event is then also triggered on the collection, as you have seen. But, the value of your subtabs attribute is not changing at all, it is still the same object you created in defaults. If you used tab.set('subtabs', new Subtabs); you would get a change:subtabs event, but you don't want to do that.

我认为你将不得不做一些事情在你的code以触发标签模型的新事件。

I think you would have to do something in your code to trigger a new event on your Tab model.

// Tab Model
var Tab = Backbone.Model.extend({
    defaults: { label: undefined, subtabs: new Subtabs},
    initialize: function(){
        // listen for change in subtabs collection.
        this.get('subtabs').on('change', this.subtabsChanged, this);
    },
    subtabsChanged: function(model) {
        // trigger new event.
        this.trigger('subtab:change', this, model);
    }
});

然后，你可以监听的事件：

Then you could listen for the event:

tabs.on('subtab:change', function(tab, subtab) { 
    console.log(tab.get('label'));
    console.log(subtab.get('label'));
});

这会的工作，我想。但我想，我想知道为什么要听你的Tabs集合在子选项卡的变化。在大多数情况下，它可能会更好，只是听你的子选项卡集合本身变化的事件。

This will work, I think. But I guess I am wondering why you would listen to your Tabs collection for a change in the Subtabs. In most cases, it might be better to just listen for the change event on your Subtabs collection itself.

tab.get('subtabs').on('change', function(model){
    // do something with model, which is a Subtab.
});

编辑： http://jsfiddle.net/phoenecke/DvHqH/1/

这篇关于I＆QUOT如何;冒泡＆QUOT;嵌套骨干藏品事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！