Wie kann man in EmberJS effektiv mehrere Modelle auf derselben Route laden?

EmberJS: Laden mehrerer Modelle auf derselben Route

Bei der Verwendung von EmberJS kann es vorkommen, dass Sie mehrere nicht verwandte Modelle laden müssen die gleiche Route. Dies kann verwirrend sein, insbesondere wenn Sie mit clientseitigen MVC-Frameworks noch nicht vertraut sind.

Achtung:

Bevor Sie versuchen, mehrere Modelle zu laden, beachten Sie Folgendes:

• Ladet die Route dynamische Daten basierend auf einem URL-Slug (z. B. /books/:id)? Wenn ja, laden Sie nicht mehrere Modelle aus dem Modell-Hook, da dadurch der Modell-Hook übersprungen und das bereitgestellte Modell verwendet werden kann, was möglicherweise zu Problemen führt.

Gegebenenfalls mehrere Modelle laden:

Wenn die Route keine dynamische URL hat, können Sie mehrere Modelle über den Modell-Hook der Route zurückgeben. Zum Beispiel:

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return {
           model1: ['red', 'yellow', 'blue'],
           model2: ['green', 'purple', 'white']
    };
  }
});

Laden mehrerer Modelle mit Versprechen:

Wenn das Abrufen von Daten Versprechen beinhaltet, können Sie die RSVP.hash-Methode im Modell-Hook verwenden:

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return Ember.RSVP.hash({
           model1: promise1,
           model2: promise2
    });
  }
});

Modelle mit Ember-Daten laden:

Wenn Sie Ember-Daten verwenden, finden Sie mehrere Modelle im Modell-Hook:

App.IndexRoute = Ember.Route.extend({
  var store = this.store;
  model: function() {
    return Ember.RSVP.hash({
           cats: store.find('cat'),
           dogs: store.find('dog')
    });
  }
});

Alternativer Ansatz (besser geeignet für die Handhabung dynamischer Routen):

Anstatt mehrere Modelle aus dem Model-Hook zu laden, können Sie die Hooks setupController oder afterModel verwenden, um Modelleigenschaften auf dem Controller festzulegen:

Setup-Controller-Methode:

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

Nach-Modell-Methode:

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

Dieser Ansatz stellt sicher, dass die Modelle korrekt sind verfügbar im setupController-Hook, wo Sie sie sicher Controller-Eigenschaften zuweisen können.

Das obige ist der detaillierte Inhalt vonWie kann man in EmberJS effektiv mehrere Modelle auf derselben Route laden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!