2016-12-09 2 views
3

Ich benutze Angular 1.5.9.Angular 1.5. Komponenten Kommunikation. Best Practice

Im Moment habe ich zwei Komponenten, die kommunizieren müssen. Wenn ich etwas in der ersten ändere (zB Artikel in der Liste auswählen) => zweite muss geändert werden (das gewählte Element muss angezeigt werden) und umgekehrt (im zweiten ändern => in der ändern) erster) ich habe über viele Ansätze lesen, so kann ich dies in wenigen Arten verwalten:

  1. Kommunikation über gemeinsam nutzbaren Dienst
  2. mit zwei-Wege-Datenbindung („=“ Option in der Komponente Bindungen). Beispiel: https://jsfiddle.net/peter_drinnan/t4q4nrfp/27/
  3. Verwendung der Einwegdatenbindung mit Eingabe/Ausgabe-Ansatz. Beispiel: http://stackoverflow.com/questions/36033940/how-to-pass-data-between-child-components-in-angular-1-5-not-using-scope
  4. Verwendung von "require" (eine übergeordnete Komponente, um Daten zu teilen). Beispiel: http://stackoverflow.com/questions/36645065/component-communication-in-angular-1-5

Vielleicht vermisse ich etwas? Was ist die beste Vorgehensweise?

Vielen Dank.

Antwort

0

Ihr ganzes Beispiel ist ideal für die Verwendung von 3 Option:

  1. Stammkomponente zu laden/speichern Daten
  2. Komponentenliste zu zeigen, mit Rückruf auf ausgewählter
  3. Komponente zeigen (+ edit)

diese Weise können Sie einfach Testbarkeit geben und etc. (Bitte nehmen Sie sich einen Blick auf benefit list)

Was für mich interessant ist, ist, wie zwischen nicht so schließen Komponenten zu kommunizieren:

Wir haben die Komponente A zu zeigen, Städte und Komponente B zeigen Länder jeweils Belastungsdaten für sich selbst, und Trick ist - Wenn Sie die letzte Stadt aus Land (A) löschen, müssen Sie das Land aus einer Liste entfernen (C). Nehmen wir an, , dass wir Liste der Länder neu laden müssen ...

Was ist die beste Praxis, in diesem Fall zu kommunizieren?

Ich habe ein starkes Gefühl, dass Ereignisse $ rootScope mit schlechten Weg zu gehen ...

Verwandte Themen