2013-03-20 5 views
3

J'essaie de convertir une application en Backbone Marionette et je rencontre un problème de rendu d'une collection d'éléments contenant chacun plusieurs sous-collections.Rendu d'une collection avec plusieurs sous-collections

Contexte:

Je travaille sur une application de carnet d'adresses, la plupart du temps pour mon édification, mais aussi, espérons utile à d'autres. L'écran principal de cette application affiche une liste des contacts de l'utilisateur. Chacun de ces contacts est représenté par une vue avec un seul modèle le supportant. Chacun de ces modèles contient des informations relationnelles supplémentaires stockées en tant que collection sur une propriété du modèle. C'est-à-dire que les numéros de téléphone et les adresses e-mail sont stockés en tant que collection sur chaque contact. Ces relations sont toutes de retour par Backbone Relational et c'est bon.

Le problème:

Ma première pensée en essayant de convertir le point de vue de contact de Backbone.View Marionette était d'utiliser Backbone.Marionette.CompositeView, mais la vue composite ne prend qu'une seule collection. Quelle est la bonne façon de rendre un objet récurrent contenant plusieurs collections?

+0

-ils vraiment besoin d'être collections? Cette approche semble un peu trop sophistiquée. Existe-t-il un point de terminaison API pour les numéros de téléphone? Sont-ils en train de stocker des modèles Backbone ou seulement des primitives Javascript? –

+0

Ils sont en fait des modèles Backbone. Il y a des informations supplémentaires sur chacun d'eux, sinon ils seraient juste des champs directement sur le modèle parent. Je suis sûr que ce dont on a besoin, c'est d'un ajustement de ma façon de penser à Marionette. –

+0

CompositeView ne fonctionnera pas pour la raison que vous avez indiquée, mais vous pouvez facilement créer un ItemView qui gère plusieurs instances de CollectionView. C'est essentiellement ce que fait un CompositeView. –

Répondre

4

J'ai écrit un billet de blog sur un problème similaire. La clé consiste à utiliser une vue composite pour rendre la collection et à lui donner une autre vue composite en tant que propriété "itemView" pour rendre la collection imbriquée.

Code de travail: http://davidsulc.github.com/backbone.marionette-nested-views/

Blog post: http://davidsulc.com/blog/2013/02/03/tutorial-nested-views-using-backbone-marionettes-compositeview/

code repo: https://github.com/davidsulc/backbone.marionette-nested-views

Note: vous pouvez également voir le psot blog de Derick sur les vues imbriquées http://lostechies.com/derickbailey/2012/04/05/composite-views-tree-structures-tables-and-more/

+0

Cela semble couvrir l'utilisation ordinaire d'une vue composite. Pour étendre l'exemple à partir de la publication de blog liée, je souhaite afficher une City (qui correspond à la partie ItemView de CompositeView) et afficher deux collections attachées à cette ItemView, car cette City possède une collection de Heroes et une collection de Villains. C'est, deux collections distinctes. Après avoir lu et manipulé du code, il semble que le meilleur moyen est d'utiliser un ItemView pour la City et de placer du code dans le callback OnRender pour que City crée et rende un Heroes CollectionView et un autre pour Villains. –

Questions connexes