在父組件上強制刷新

我正在使用Angular 2中的一個小型數據網格，並且對組件之間的父/子關係有個疑問。我有兩個組件：app-datagrid和app-add-item。 datagrid組件在他的HTML中包含app-add-item組件，它由一個按鈕和一個模式組成。點擊後，該按鈕將顯示帶有窗體的模式以創建新項目。在父組件上強制刷新

所有的邏輯都是孤立的，很好：app-add-item組件創建並處理表單，將表單數據發送到服務並創建一個新項目。但是，一旦其子組件添加完新項目後，如何更新數據網格呢？

app-datagrid組件是否應該監聽事件？它應該作爲一個依賴項傳遞給孩子嗎？這樣做的正確方法是什麼？

來源

2017-03-29 vinnylinux

我想你可以讓app-add-item組件發出一個@Output事件來指示一個項目已被添加。然後有app-datagrid綁定到該事件 - 如下所示：

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

來源

2017-03-29 07:00:03

這不會在兩者之間添加一個非常直接的依賴關係嗎？他們不應該孤立嗎？ – vinnylinux

我的意思是：爲什麼add-item組件需要知道datagrid組件正在期待它的東西？ – vinnylinux

add-item組件不知道datagrid的期望是什麼 - 它只是提供了一個輸出事件，指出已經添加了一些東西。您可以將許多操作綁定到該事件 - 例如在網格中添加一行，顯示一條消息等等。這些操作都沒有在add-item組件中定義。 –

在父組件上強制刷新

回答

相關問題