IN ACHT NEHMEN:
Sie möchten vorsichtig sein, ob die Rückgabe mehrerer Modelle in Ihrem Modellhaken angemessen ist. Stellen Sie sich diese einfache Frage:
- Lädt meine Route dynamische Daten basierend auf der URL mithilfe eines Slugs
:id? dh
this.resource('foo', {path: ':id'});
Wenn Sie mit Ja geantwortet haben
Versuchen Sie nicht, auf dieser Route mehrere Modelle vom Modellhaken zu laden !!! Der Grund liegt in der Art und Weise, wie Ember die Verknüpfung mit Routen handhabt. Wenn Sie beim Verknüpfen mit dieser Route ein Modell angeben ( {{link-to 'foo' model}}, transitionTo('foo', model)), wird der Modell-Hook übersprungen und das mitgelieferte Modell verwendet. Dies ist wahrscheinlich problematisch, da Sie mehrere Modelle erwartet haben, aber nur ein Modell ausgeliefert wird. Hier ist eine Alternative:
Mach es in setupController/afterModel
App.IndexRoute = Ember.Route.extend({
model: function(params) {
return $.getJSON('/books/' + params.id);
},
setupController: function(controller, model){
this._super(controller,model);
controller.set('model2', {bird:'is the word'});
}
});
Beispiel: http://emberjs.jsbin.com/cibujahuju/1/edit
Wenn Sie es benötigen, um den Übergang zu blockieren (wie es der Modellhaken tut), geben Sie ein Versprechen vom afterModelHaken zurück. Sie müssen die Ergebnisse dieses Hooks manuell verfolgen und an Ihren Controller anschließen.
App.IndexRoute = Ember.Route.extend({
model: function(params) {
return $.getJSON('/books/' + params.id);
},
afterModel: function(){
var self = this;
return $.getJSON('/authors').then(function(result){
self.set('authors', result);
});
},
setupController: function(controller, model){
this._super(controller,model);
controller.set('authors', this.get('authors'));
}
});
Beispiel: http://emberjs.jsbin.com/diqotehomu/1/edit
Wenn Sie mit Nein geantwortet haben
Lassen Sie uns mehrere Modelle vom Modell-Hook der Route zurückgeben:
App.IndexRoute = Ember.Route.extend({
model: function() {
return {
model1: ['red', 'yellow', 'blue'],
model2: ['green', 'purple', 'white']
};
}
});
Beispiel: http://emberjs.jsbin.com/tuvozuwa/1/edit
Wenn darauf gewartet werden muss (z. B. ein Anruf beim Server, eine Art Versprechen)
App.IndexRoute = Ember.Route.extend({
model: function() {
return Ember.RSVP.hash({
model1: promise1,
model2: promise2
});
}
});
Beispiel: http://emberjs.jsbin.com/xucepamezu/1/edit
Im Fall von Ember Data
App.IndexRoute = Ember.Route.extend({
var store = this.store;
model: function() {
return Ember.RSVP.hash({
cats: store.find('cat'),
dogs: store.find('dog')
});
}
});
Beispiel: http://emberjs.jsbin.com/pekohijaku/1/edit
Wenn eines ein Versprechen ist und das andere nicht, ist alles gut, RSVP wird diesen Wert gerne nur verwenden
App.IndexRoute = Ember.Route.extend({
var store = this.store;
model: function() {
return Ember.RSVP.hash({
cats: store.find('cat'),
dogs: ['pluto', 'mickey']
});
}
});
Beispiel: http://emberjs.jsbin.com/coxexubuwi/1/edit
Mix and Match und viel Spaß!
App.IndexRoute = Ember.Route.extend({
var store = this.store;
model: function() {
return Ember.RSVP.hash({
cats: store.find('cat'),
dogs: Ember.RSVP.Promise.cast(['pluto', 'mickey']),
weather: $.getJSON('weather')
});
},
setupController: function(controller, model){
this._super(controller, model);
controller.set('favoritePuppy', model.dogs[0]);
}
});
Beispiel: http://emberjs.jsbin.com/joraruxuca/1/edit