Ich möchte eine Seite erstellen, auf der ich links eine feste Ansicht (einige Filter) habe, die auf die Ergebnisse auf der rechten Seite angewendet werden.
Zum Beispiel auf der linken Seite sind Filter zum Filtern von Filmen nach Genre, Titel, Jahr der Erstellung .... Auf der rechten Seite sind verschiedene Diagramme und Tabellen, die auf der Grundlage der ausgewählten Filter aktualisieren.
Ich dachte also daran, eine feste Sicht auf der linken Seite zu haben, dann auf der rechten Seite eine Steckdose, die sich je nach Route ändern würde.
Ist das der richtige Weg? Wenn dies der Fall ist, kann ich nicht herausfinden, wie Filteränderungen auf den Controller auf der rechten Seite übertragen werden.
Dieser JSFiddle zeigt ein ähnliches Setup: Ссылка
In der ContentRoute - & gt; setupController Ich bekomme eine Instanz von NavigationController, aber ich kann nicht herausfinden, wie man Änderungen an someValue bekommt.
Wie kann ContentController im obigen Beispiel die Änderungen an someValue in NavigationController erhalten?
Ist das der richtige Weg, um die App, die ich in Ember beschrieben habe, zu implementieren?
JavaScript:
%Vor%HTML:
%Vor%Ich bin vorgegangen und habe dir einen JSFiddle erstellt mit einer grundlegenden Implementierung dessen, wonach du suchst. Ich denke, es lohnt sich, alles durchzulaufen, damit Sie Ember in den Griff bekommen.
Router
Wir konfigurieren gerade unser IndexRoute an diesem Punkt, wo wir alle unsere Songs für die {{outlet}} speichern.
Es besteht eine gute Chance, dass dieser Code durch einen AJAX-Aufruf an Ihr Backend Ruby / PHP ersetzt wird. Vorläufig geben wir der IndexRoute die Verantwortung für die Einrichtung des Controllers (daher setupController ). Diese Verantwortung könnte auch auf dem Controller selbst liegen, und es ist wahrscheinlich eine gute Idee, den AJAX-Aufruf zu abstrahieren, da Sie viele ähnliche AJAX-Aufrufe haben.
Sie können sich auch dazu entschließen, Embers DataStore zu verwenden, wodurch die Implementierung des Controllers erneut geändert wird.
Index-Controller
Als nächstes werden wir unsere IndexController (das ist unser SongsController wirklich) einrichten, wir wollen, dass dieser Controller zwei Verantwortlichkeiten hat:
Dafür erstellen wir eine berechnete Eigenschaft , um den Inhalt herauszufiltern, da wir dies nicht tun möchte das spezielle Array content direkt manipulieren.
Das excludeGenres nimmt ein Array von Genre-Objekten an. Zum Beispiel, wenn "Post Rock" in excludeGenres enthalten ist, dann werden wir keine "Post Rock" bezogenen Songs anzeigen, aber wenn es nicht vorhanden ist, dann werden wir es ihnen zeigen! Das IndexController ist nicht dafür verantwortlich, dieses Array zu verwalten, aber es ist dafür verantwortlich, seinen Inhalt zu filtern, wenn dieses Array aktualisiert wird .
Genre-Controller
Vielleicht der verwirrendste Controller in unserer kleinen Anwendung, denn er hat eigentlich keinen eigenen Inhalt, sondern hängt vom Inhalt von IndexController ab.
Die Verantwortlichkeiten des Genre-Controllers können folgendermaßen definiert werden:
content -Array von IndexController zu überwachen und die eindeutigen Genre-Namen zu holen, wenn sich deren Länge ändert; excludeGenres -Arrays, wenn ein Benutzer auf ein Genre in der Liste klickt, um es einzuschließen / auszuschließen. Um die Methode toggle aufrufen zu können, müssen wir in unserer Genresicht eine Aktion angeben, um sie aufzurufen, wenn Sie darauf klicken: <a {{action "toggle" genre}}>{{genre}}</a> . Wenn nun ein Nutzer auf ein Genre klickt, wird die toggle -Methode aufgerufen und der Genre-Name als erstes Argument übergeben.
Sobald wir uns in der Methode toggle befinden, wird bestimmt, ob das Genre bereits ausgeschlossen wird. Wenn es ausgeschlossen wird, wird es entfernt und umgekehrt. Sobald wir das Genre hinzugefügt / entfernt haben, wird die filteredContent berechnete Eigenschaft erneut ausgelöst und die Indexansicht wird nahtlos aktualisiert.
Der Grund dafür, dass GenresController eigentlich keinen eigenen Inhalt hat, ist, dass es albern erscheint, zwei content -Arrays zu verwalten, wenn die beiden eine Beziehung haben. Da Genres aus den in der Anwendung vorhandenen Liedern bestimmt werden können, kann der Controller die Informationen aus dieser Liste sammeln und nur die Informationen herausziehen, die er benötigt - in unserem Fall Genres.
Auf diese Weise kann die Liste der Genres synchronisiert werden, wenn ein Titel hinzugefügt oder entfernt wird.
Fazit
Ich denke, die Antwort auf Ihre ursprüngliche Frage ist jedoch, dass Controller miteinander kommunizieren müssen, indem Sie angeben, was sie benötigt (mit needs ).
needs für Ember Controllers ist veraltet und wurde in Ember 2.0 entfernt. Sehen Sie sich die Verfallserklärung .
Um den Guide hier zu kopieren / einzufügen, anstatt zu schreiben:
%Vor%Sie sollten schreiben:
%Vor% Ember.inject.controller() sucht den Controller nach dem gleichen Namen wie der zugewiesene Schlüssel - in diesem Fall der comments Controller. Weitere Informationen finden Sie in der API-Dokumentation .
Tags und Links ember.js