Erzwingen einer Aktualisierung der übergeordneten Komponente

Ich arbeite mit einem kleinen Datagrid in Angular 2 und ich habe eine Frage über Eltern/Kind-Beziehungen zwischen Komponenten. Ich habe zwei Komponenten: app-datagrid und app-add-item. Die Datagrid-Komponente enthält in seinem HTML die Komponente app-add-item, die aus einer Schaltfläche und einem Modal besteht. Wenn Sie auf die Schaltfläche klicken, wird das Modal mit einem Formular zum Erstellen eines neuen Elements angezeigt.Erzwingen einer Aktualisierung der übergeordneten Komponente

Die ganze Logik ist isoliert und nett: Die Komponente app-add-item erstellt und verarbeitet das Formular, sendet die Formulardaten an den Dienst und erstellt ein neues Element. Wie kann ich das Datagrid jedoch aktualisieren, wenn die untergeordnete Komponente ein neues Element hinzugefügt hat?

Sollte die Komponente app-datagrid auf ein Ereignis warten? Sollte es als Abhängigkeit vom Kind weitergegeben werden? Was ist der richtige Weg, dies zu tun?

Quelle

2017-03-29 vinnylinux

Ich denke, Sie könnten die app-add-item Komponente ein @Output Ereignis emittieren, um anzuzeigen, dass ein Element hinzugefügt wurde. Dann haben Sie die app-datagrid Bindung zu diesem Ereignis - etwas wie das:

<app-data-grid #dataGrid> 
.. 
    <app-add-item (itemAdded)="dataGrid.addNewItem($event)"></app-add-item> 
.. 
</app-data-grid>

Quelle

2017-03-29 07:00:03

Fügt das nicht eine ziemlich direkte Abhängigkeit zwischen den beiden? Sollten sie nicht isoliert sein? – vinnylinux

Was ich meine ist: warum die Add-Item-Komponente muss wissen, dass eine DataGrid-Komponente Zeug davon erwartet? – vinnylinux

Die Komponente "add-item" weiß nicht, was das Datagrid erwartet - es stellt lediglich ein Ausgabeereignis bereit, das anzeigt, dass etwas hinzugefügt wurde. Sie könnten eine Reihe von Aktionen an dieses Ereignis gebunden haben - z. fügen Sie dem Raster eine Zeile hinzu, zeigen Sie eine Nachricht usw. an. Keine dieser Aktionen ist in der Komponente add-item definiert. –

Erzwingen einer Aktualisierung der übergeordneten Komponente

Antwort

Verwandte Themen