2012-03-28 14 views
10

mam dwa modele kręgosłup, ładowane z serwera:backbone.js złożony model sprowadzić

var Model = Backbone.Model.extend({}); 
var SubModel = Backbone.Model.extend({}); 

var SubCollection = Backbone.Collection.extend({ 
    model: SubModel 
}); 

var m = new Model(); 
m.fetch({success: function(model) 
{ 
    model.submodels = new SubCollection(); 
    model.submodels.url = "/sub/" + model.get("id"); 
    model.submodels.fetch(); 
}}); 

Tak, serwer musi wysłać dwie oddzielne reakcje. Na przykład:

{ name: "Model1", id: 1 } // For Model fetch 

i

[{ name: "Submodel1", id: 1 }, { name: "Submodel2", id: 2 }] // For Submodel collection fetch 

Czy istnieje sposób, aby sprowadzić instancji model z kolekcji submodel naraz, jak:

{ 
    name: "Model1", 
    id: 1, 
    submodels: [{ name: "Submodel1", id: 2 }, { name: "Submodel1", id: 2 }] 
} 

Odpowiedz

11

Aby móc to zrobić, że jest gotowy do twojego back-endu - tak naprawdę nie ma to nic wspólnego z Backbone.

Czy można skonfigurować technologię zaplecza do zwrócenia powiązanych modeli jako zasobów zagnieżdżonych?

Jeśli back-end jest szynach, na przykład, a twoje modele są związane w ActiveRecord, jednym ze sposobów na to jest coś

respond_to do |format| 
    format.json { render :json => @model.to_json(:include => [:submodels])} 
end 

Co back-end technologii używasz?

Edit:

Niestety, źle sens twojego pytania, raz masz swój back-end zwrotu JSON we właściwym formacie, tak, są rzeczy, które trzeba zrobić, aby w Backbone być w stanie sobie z tym poradzić.

Backbone-relacyjne

Jednym ze sposobów radzenia sobie z tym jest użycie Backbone-Relational, wtyczka do obsługi podobnych modeli.

zdefiniować podobnych modeli poprzez właściwość „Stosunki”:

SubModel = Backbone.RelationalModel.extend({}); 

SubCollection = Backbone.Collection.extend({ 
    model: SubModel 
}); 

Model = Backbone.RelationalModel.extend({ 
    relations: [ 
    { 
     type: 'HasMany', 
     key: 'submodels', 
     relatedModel: 'SubModel', 
     collectionType: 'SubCollection' 
    } 
    ] 
}); 

Gdy model pobiera JSON, będzie on automatycznie utworzyć SubCollection pod własność „podmodeli” i zaludnienia go podmodeli - po jednym dla każdego Obiekt JSON w tablicy.

jsfiddle dla szkieletowej-relacyjnego: http://jsfiddle.net/4Zx5X/12/

Ręcznie

Można to zrobić ręcznie, jeśli chcesz, jak również. W polega nadrzędnych funkcji parse dla swojej klasie modelu (wybacz mi, jeśli mój JS nie jest w 100% poprawne - robi coffeescript tyle ostatnio jego przewodowych w moim mózgu)

var Model = Backbone.Model.extend({ 
    parse: function(response) { 
    this.submodels = new SubCollection(); 
    // Populate your submodels with the data from the response. 
    // Could also use .add() if you wanted events for each one. 
    this.submodels.reset(response.submodels); 
    // now that we've handled that data, delete it 
    delete response.submodels; 
    // return the rest of the data to be handled by Backbone normally. 
    return response; 
    } 
}); 

parse() uruchamia przed initialize() i przed ustawieniem asocjacji atrybutów, więc nie można uzyskać dostępu do atrybutu model.attributes, a model.set() kończy się niepowodzeniem, dlatego musimy ustawić kolekcję jako bezpośrednią własność modelu, a nie jako "właściwość", którą uzyska dostęp za pomocą polecenia get/set.

W zależności od tego, co ma się wydarzyć przy "save()", konieczne może być przesłonięcie `toJSON ', aby uzyskać wersję serializowaną modelu wyglądającą jak oczekiwane przez API.

jsfiddle:

http://jsfiddle.net/QEdmB/44/

+0

dobrze ... back-end jest ręcznie wykonany CPP (i nie istnieją sposoby, aby zmienić go Rails lub Django) :) ale, o ile mi zrozumiałe, twoje rozwiązanie sformatuje odpowiedź jak JSON podany w moim pytaniu ... tak, szkielet nie będzie interpretował obiektów w "podmodelach" jako Submodeli ... mam rację? –

+0

Wariant z relacją szkieletową wydaje się nie działać poprawnie, ponieważ tablica "podmodeli" staje się tablicą obiektów, a nie SubModels Przetestowałem twoje skrzypce nieco, zobacz http://jsfiddle.net/4Zx5X/3/ –

+0

OK, spróbuję tego na prawdziwej prośbie ajaxowej. W każdym razie, dziękuję za szczegółową odpowiedź! –

Powiązane problemy