Ember js Wie erzwinge das Nachladen eines bestimmten ausgewählten Datensatzes?

Question

Ich habe das gleiche Problem wie beschrieben here, aber verstehe nicht, wie es für meine Situation gilt, da ich keine "Show" Route habe.

geerbt ich diese App, und die router.js sieht wie folgt aus:

App.Router.map(function() { 
    this.route('index', { 
    path: '/' 
    }); 
    return this.resource('parent', { 
    path: '/:parent_id' 
    }, function() { 
    this.resource('games', { 
     path: '/games' 
    }); 
    return this.resource('game', { 
     path: '/game/:game_id' 
    }); 
    }); 
}); 

Das Backend ist Rails, und wenn die/Spiele-URL in Ember getroffen wird, ruft er die Spiele Index Aktion in den Schienen GamesController, wie erwartet.

Die Spiele Vorlage macht jedes Spiel:

<ul class="gamesList"> 
{{#each game in sortedGames}} 
    {{#link-to 'game' game class='gameItem u-cf' tagName='li'}} 
    <div class="gameItem-name u-before6of12 u-after1of12">{{game.name}}</div> 
    <div class="gameItem-description u-before6of12 u-after1of12">{{game.description}}</div> 
    {{/link-to}} 
{{/each}} 

aber wenn das Spiel Link geklickt wird, lädt es das Spiel von Ember zu speichern und nicht eine Anfrage an die API machen.

Ich brauche es, um eine Anfrage an die API zu stellen, weil: 1. Die Liste der Spiele enthält nur Name und Beschreibung, da die Liste viele Spiele enthalten kann, so dass wir nur eine Teilmenge der Daten laden wollen Spiel. 2. Ein einzelnes Spiel, das von der Rails Show-Aktion geladen wird, sollte einen anderen Serializer verwenden, um den gesamten zusätzlichen Inhalt für ein einzelnes Spiel zu laden (einschließlich eingebetteter Child-Objekte).

Dies ist die Spiele Route:

App.GamesRoute = Ember.Route.extend(Easypeasy.ResetScroll, { 
    model: -> 
    return this.store.find('game', { 
     parent: @modelFor('parent').get('slug') 
    }) 
}) 

und das ist das Spiel Route:

App.GameRoute = Ember.Route.extend(App.ResetScroll) 

Wie kann ich Ember löse das einzelne Spiel zu laden, dass der Benutzer auf klickt?

Answer 1

So ember Daten standardmäßig nicht erneut Daten anfordern, die es bereits geladen hat. Wenn das Modell Ihrer übergeordneten Route ein Array von Spielen geladen hat, wird für die untergeordnete Route, für die ein bestimmtes Spiel erforderlich ist, keine weitere Anfrage gestellt. Der folgende Code

this.store.findRecord('game', params.game_id) 

wird einfach in den speicherinternen ember-Datenspeicher schauen und den Spieldatensatz zurückgeben.

In Fällen, in denen Sie eine weitere Anforderung vornehmen müssen, können Sie das Verhalten über eine Option erzwingen

this.store.findRecord('game', params.game_id, {reload: true}); 

Sie können hier über dieses Verhalten lesen: http://emberjs.com/api/data/classes/DS.Store.html#method_findRecord

Notiz tun, dass ich die Verknüpfung bin zu Ember 2.0 docs, aber das funktioniert auch mit ember data 1. Wenn Sie ember Daten verwenden < 2.0 wird Ihr Anruf wahrscheinlich wie diese

this.store.find('game', params.game_id, {options: reload}); 

Einen anderen Weg, dies zu tun reload() auf dem Modellinstanz zu nennen, ist selbst. Dies erweist sich auch als nützlich, wenn Sie wissen, dass sich Daten auf dem Server geändert haben und Sie nach einer Aktion erneut Daten für ein Modell anfordern möchten.

Und schließlich bietet Ember Data 2.0 noch mehr Optionen, wo Sie schnell Daten aus dem Laden laden können, aber auch eine Anforderung im Hintergrund stellen, um weitere Informationen zu holen. Dies kann entweder gut oder schlecht sein, je nachdem, ob Ihre Benutzer fehlende Inhalte sehen oder ob sie warten sollen.