Modèles imbriqués et collection dans backbonejs

Question

Je suis à la recherche d'une solution pour charger le json imbriqué dans le modèle parent pour être finalement rendu à l'écran. J'ai un JSON imbriqué dans ce format:

{ 
    "name":"Hotel-A", 
    "description":"5 star rating", 
    "geographicAddress":{ 
     "streetAddress":"343,Market st", 
     "city":"San Jose", 
     "state":"CA", 
     "country":"USA", 
     "postalCode":"34523" 
    }, 
    "id":"338a947b-c488-46a9-b68f-640fcda38577" 
    } 

J'ai un modèle parent qui a plus référence au modèle geographicAddress et geographicPoint.

Voici à quoi il ressemble:

modèle parent:

defaults:{ 
    "id" : "", 
    "name" : "", 
    "description" : "", 
    "geographicAddress": new geoAddress(), 
} 

Parent Collection:

addParentModel: function(parent) { 
     var newParentModel = new this.model(); 
     newParentModel.set({ 
       id: parent.id, 
       name: parent.name, 
       description: parent.description, 
       address:geoAddress.streetAddress, 
       city:geoAddress.city, 
       state:geoAddress.state, 
       postalCode:geoAddress.postalCode 

      }); 

géographique modèle Adresse:

defaults:{ 
      "streetAddress":"", 
      "city":"", 
      "state":"", 
      "country":"", 
      "postalCode":"" 
     } 

Quelqu'un pourrait-il me montrer un façon t o peupler le modèle parent avec le json imbriqué et le rendre en html.

Merci.

Answer 1

Je suggère de surcharger la fonction parse de Backbone.Model afin de structurer les données comme vous le souhaitez. De la documentation Backbone:

La fonction est passé l'objet de réponse brute, et devrait retourner les attributs de hachage être mis sur le modèle. L'implémentation par défaut est un no-op, en passant simplement par la réponse JSON. Remplacez ceci si vous devez travailler avec une API préexistante, ou un meilleur espace de nommage vos réponses .

var PlaceModel = Backbone.Model.extend({ 
    defaults: { 
    "id": "", 
    "name": "", 
    "description": "", 
    "geographicAddress": new AddressModel() 
    }, 
    parse: function(data) { 
    return { 
     id: data.id, 
     name: data.name, 
     description: data.description, 
     geographicAddress: new AddressModel(data.geographicAddress) 
    }; 
    } 
}); 

J'ai créé une démo plus complète qui montre la création de modèles à l'aide parse puis rendu une collection ici: https://jsfiddle.net/f8L2z0ba/