簡體   English   中英

在 Angular 的嵌套子組件中傳遞數據的最佳方法是什么?

[英]What could be the best approach to pass data in nested child components, in Angular?

我有一個場景,例如

<parent-comp>
 <side-bar></side-bar>
 <item-details></item-details>
</parent-comp>

<side-bar>
 <item-list></item-list>
</side-bar>

我需要將項目列表共享到組件“ItemListComponent”和“ItemDetailsComponent”中,並牢記層次結構

方法一

我可以從 ParentComponent 中的 ItemService 獲取項目並通過屬性/屬性發送它<sidebar [pages]="pages"></sidebar> >>> <item-list [pages]="pages"></item-list><item-details[pages]="pages"></item-details>

我需要通過 SidebarComponent 傳遞數據以將其傳輸到 ItemListComponent。

方法二

從 ParentComponent 中的 ItemService 獲取項目,而不是通過屬性/屬性傳遞,它發出數據(RxJs),比如事件名稱“ItemDataFetched”,以及訂閱該事件的 ItemList/ItemDetails 組件。

兩者中最好的方法是什么? 或者還有其他更好的方法嗎?

在此處查看: https : //angular.io/guide/component-interaction angular 團隊提出的方法。

我會說輸入綁定是大多數情況下的方法。

  1. 這是專利兒童通信的標准方式。 這將是未來開發人員所期望看到的,使調試更容易。
  2. 通常要避免事件傳遞數據。 如果您沒有使用帶有發射器的事件綁定來進行子級到父級的通信,那么您將脫離角度循環並可能導致意外問題。
  3. 使用服務始終是一種選擇。 請記住,盡管服務是單例的。 因而有其自身的局限性。

順便說一句,我希望子組件通知父組件選擇並僅將所選項目的頁面傳遞給項目詳細信息組件。 不是整個集合。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM