J'ai une application Backbone qui utilise des collections imbriquées (du moins c'est comme ça que je pense qu'elles sont appelées).
Dans mon cas particulier, il y a des onglets et des sous- onglets , et chaque onglet (modèle) contient une collection de sous-onglets (modèle).
Pour ceux qui connaissent mieux le code, j'écris ci-dessous mes modèles et collections, et comment les sous-onglets sont imbriqués dans le modèle de tabulation:
// 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 });
Maintenant, lorsque je modifie l'attribut d'un tabulage, il déclenche l'événement de changement sur le modèle Tab
et aussi sur la collection Tabs
(plutôt normal, non?), Mais lorsque je change l'attribut d'un sous-groupe, il déclenche l'événement de modification sur le modèle Subtabs
et Subtabs
(Ce qui est également normal), mais il ne fait pas exploser le modèle Tab
(et la collection Tabs
).
Au moins, je suppose que cela devrait être dû au fait qu'une collection d'un modèle a été modifiée et que le modèle a été changé (mais peut-être que je me trompe et je ne l'ai pas compris).
Toute suggestion sur la façon d'atteindre ce comportement avec Backbone?
Un événement de change
est déclenché par Backbone lorsqu'un attribut change via l' set
. L'événement est également déclenché sur la collection, comme vous l'avez vu. Mais, la valeur de votre attribut de sous- subtabs
ne change pas du tout, c'est toujours le même objet que vous avez créé dans les defaults
par defaults
. Si vous avez utilisé tab.set('subtabs', new Subtabs);
Vous recevrez un change:subtabs
événement sous- change:subtabs
, mais vous ne voulez pas le faire.
Je pense que vous devriez faire quelque chose dans votre code pour déclencher un nouvel événement sur votre modèle Tab.
// 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); } });
Ensuite, vous pouvez écouter l'événement:
tabs.on('subtab:change', function(tab, subtab) { console.log(tab.get('label')); console.log(subtab.get('label')); });
Cela fonctionnera, je pense. Mais je pense que je me demande pourquoi tu écoutes ta collection Tabs pour changer les sous-onglets. Dans la plupart des cas, il est préférable d'écouter l'événement de changement sur votre collection Subtabs.
tab.get('subtabs').on('change', function(model){ // do something with model, which is a Subtab. });