Verschachtelte Modelle und Sammlung in Backbonejs

Question

Ich bin auf der Suche nach einer Lösung zum Laden der verschachtelten JSON im übergeordneten Modell, um schließlich auf dem Bildschirm gerendert werden. Ich habe eine verschachtelte json in diesem 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" 
    } 

I ein übergeordnetes Modell haben, das weiter Bezugnahme auf geographicAddress und geographicPoint Modell hat.

Dies ist, wie es aussieht:

Modell Parent:

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

Eltern 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 

      }); 

geographisches Model Adresse:

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

jemand mir zeigen kann Weg t o Füllen Sie das Elternmodell mit dem verschachtelten JSON und rendern Sie es in HTML.

Vielen Dank.

Answer 1

Ich würde vorschlagen, Backbone.Models parse Funktion überschreiben, um die Daten wie Sie wollen zu strukturieren. Von der Backbone-Dokumentation:

Die Funktion wird die rohe Reaktion Objekt übergeben und sollte kehren die Attribute auf das Modell gesetzt werden Hash. Die Standardimplementierung ist ein No-Op, einfach durch die JSON-Antwort. Überschreiben Sie dies, wenn Sie mit einer bereits vorhandenen API oder besser Namespace Ihre Antworten arbeiten müssen.

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) 
    }; 
    } 
}); 

Ich habe eine umfangreichere Demo erstellt, die hier parse Modelle verwenden und dann Rendern einer Sammlung zeigt die Erstellung: https://jsfiddle.net/f8L2z0ba/